做的一个手机项目，进入app公司客户端然后点击我的记事，可以添加自己的记事，作为自己对股票的分析记录或者个人心情记录都可以，，也就是一个记事的功能。。
里面有添加记事，修改记事，删除记事，记事列表。。等功能，，用到异步请求的有，添加，修改，删除。。
记事列表属于是php动态渲染页面的。直接请求成功追加html就可以了，不用自己在拼html结构。
JS分有base.js（公共的接口，截取字符串方法，时间戳的转换，等），，
addnote.js（只要是做添加记事输入框的一些输入操作，提示操作，本地存储，清除本地存储，以及添加记事和修改记事的接口，，接口是统一个，但是在修改的时候是获取pid来进行修改的。）,
notelist.js（主要是做请求记事列表的接口，和删除列表的接口。选择复选框个数，取消选择，删除等）
里面有很多知识的运行。
直接上代码，作为积累。
base.js
//@charset "utf-8";
//var info = external.createObject("Passport");
var userid = 114480318 || info.get("161506039");//调试时给加的161506039 114480318 187849908
var uname = 'changnannan' || info.get("HunkHan");
var urlMap = {
'save': "/blogapi/postapi/post/", // 添加记事的接口
//'jsUrl': "/blogapi/userpostapi/getUserPostList/"//列表接口
'jsUrl': "/stockdiary/indexapi/getList/"//列表接口
};
/**
* @desc 根据博文获取提取股市日记详情接口url
* @return string
*/
/*function getStockDiaryDetailUrl(pid){
return '/blogapi/postapi/getPostBase/' + '?pid=' + pid;
}*/
/**
* @desc 根据博文id获取博文删除接口url
* @return string
*/
function getStockDiaryDeleteUrl(pid){
return '/blogapi/postapi/delPost/' + '?ids=' + pid;
}
//时间戳转换成日期时间2014-8-8 下午11：40：20
function formatDate(ns){
return new Date(parseInt(ns) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
}
//时间戳转换成八位日期2014-5-5
function userDate(uData){
var myDate = new Date(uData*1000);
var year = myDate.getFullYear();
var month = myDate.getMonth() + 1;
var day = myDate.getDate();
return year + '-' + month + '-' + day;
}
//时间戳转换成四位时间10:10
function userTime(uTime){
var myDate = new Date(uTime*1000);
var hours = myDate.getHours();
var minutes = myDate.getMinutes();
return hours + ':' + minutes;
}
//时间戳转换成四位时间10:10:00
function userTime(uTime){
var myDate = new Date(uTime*1000);
var hours = myDate.getHours();
var minutes = myDate.getMinutes();
var second = myDate.getSeconds();
return hours + ':' + minutes + ':' + second;
}
//定时提醒设置的时间传入 (2014,05,15)返回成2014-01-21
function setDate(year,month,day){
return year + '-' + month + '-' + day;
}
//定时提醒设置的时间传入 (01：02)返回成01:01:00
function setTime(hour,minute){
return hour + ':' + minute+ ':00';
}
//时间格式2014-02-02 14:10:00改成时间戳
function js_strto_time(str_time){
var new_str = str_time.replace(/:/g,"-");
new_str = new_str.replace(/ /g,"-");
var arr = new_str.split("-");
var datum = new Date(Date.UTC(arr[0],arr[1]-1,arr[2],arr[3]-8,arr[4],arr[5]));
return strtotime = datum.getTime()/1000;
}
//时间戳改成时间格式2014-12-12 下午01：10
function js_date_time(unixtime){
var timestr = new Date(parseInt(unixtime) * 1000);
var datetime = timestr.toLocaleString().replace(/年|月/g,"-").replace(/日/g," ");
return datetime;
}
//获取location.url中的某一个字段值
function getUrlParam(item) {
var value = location.search.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)", "i"));
return value ? value[1] : value;
}
//限制字数
function mCutStr(str, len, str2) {
if (str == '') {
return '';
}
if (str2 == '') {
var str3 = '';
} else {
var str3 = str2 || '...';
}
var str_length = 0; //实际长度
var str_len = 0;
str_cut = new String();
str_len = str.length;
for (var i = 0; i < str_len; i++) {
a = str.charAt(i);
str_length++;
//中文的情况多加1
if (escape(a).length > 4) {
//中文字符的长度经编码之后大于4
str_length++;
}
str_cut = str_cut.concat(a);
if (str_length <= len && (i == (str_len - 1) || i == (str_len - 2))) {
return str;
}
if (str_length >= len && i < (str_len - 2)) {
str_cut = str_cut.concat(str3);
return str_cut;
}
}
}
addnote.js
//@charset "utf-8";
Zepto(function(){
//用户输入
$('#notetitle').focus(function () {
if ($("#notetitle").val() == '无标题笔记') {
$("#notetitle").val('')
}
$("#notetitle").css("color","#000");
});
$('#notecontent').focus(function () {
if ($("#notecontent").val() == '你想记录的内容') {
$("#notecontent").val('')
}
$("#notecontent").css("color","#000");
});
$('#notetitle').blur(function () {
var text = $(this).val();
$(this).val(mCutStr(text, 42, ''));
if(text.length == 0){
$("#notetitle").val("无标题笔记");
$("#notetitle").css("color","#D7D7D7");
}
});
$('#notecontent').blur(function () {
var text = $(this).val();
if(text.length == 0){
$("#notecontent").val('你想记录的内容');
$("#notecontent").css("color","#D7D7D7");
}
});
//定时提醒
$("#remind").change(function(){
if($(this).attr("checked") == true ){
$(".s-data, .s-time").removeAttr("disabled");
$(".s-data, .s-time").css('color','#000');
$(".s-data, .s-time").css('display','inline-block');
}else{
$(".s-data, .s-time").attr("disabled", true);
$(".s-data, .s-time").css('color','#969696');
$(".s-data, .s-time").css('display','none');
}
});
//调起日期控件
$(".s-data").click(function(){
//showDatePicker();
});
//调起时间控件
$(".s-time").click(function(){
//showTimePicker();
});
//本地存储
var nt = document.getElementById('notetitle');
var nc = document.getElementById('notecontent');
if(typeof(pid) != "undefined"){
if(nt.value != '无标题笔记'){
$("#notetitle").css("color","#000");
}
if(nc.value != '你想记录的内容'){
$("#notecontent").css("color","#000");
}
window.localStorage.clear();
}else{
if(window.localStorage.getItem('ntitle')){
nt.value = window.localStorage.getItem('ntitle');
if(nt.value != '无标题笔记'){
$("#notetitle").css("color","#000");
}
}
if(window.localStorage.getItem('ncontent')){
nc.value = window.localStorage.getItem('ncontent');
if(nc.value != '你想记录的内容'){
$("#notecontent").css("color","#000");
}
}
window.onunload = function() {
if(nt.value){
window.localStorage.setItem('ntitle',nt.value);
}
if(nc.value){
window.localStorage.setItem('ncontent',nc.value);
}
};
}
//点击完成提交数据add
$(".add-box .okbtn").tap(function(){
var title = $("#notetitle").val();
var content = $("#notecontent").val();
var cate = -1;
var opens = 0;
var stockcode = $(".no-edit").attr('stockcode');
var alert_time = alert_time;
if(title == '无标题笔记' && content == '你想记录的内容'){
alert("您还没有做任何记录哟！");
return false;
}else if(title != 0 && title != '无标题笔记' && content == '你想记录的内容'){
var content = $("#notetitle").val();
}
if($("#remind").attr("checked") == true){
var data = $(".s-data").val();
var time = $(".s-time").val();
var alert_time = data +" "+ time;
var str_time = js_strto_time(alert_time);//
//alert(str_time);
}
if(typeof(pid) != 'undefined' ){
var datas = {title:title,pid:pid,content:content,cate:cate,open:opens,stockcode:stockcode,alert_time:str_time};
}else{
var datas = {title:title,content:content,cate:cate,open:opens,stockcode:stockcode,alert_time:str_time};
}
$.ajax({
url:urlMap.save,
type:'POST',
data:datas,
dataType: 'json',
success: function(data){
if (data.errorcode == 0) {
alert('保存记事成功！');//保存云端
location.href = $(".okbtn").attr("link");//到记事列表
}else{
alert(data.errormsg);
}
},
error: function (data) {
alert(data.errormsg);
}
});
});
//判断有没有股票代码
if($(".no-edit").css("display") == "block"){
$("#notecontent").css('height','368px');
}
});
notelist.js
//@charset "utf-8";
Zepto(function(){
//与手机端交互接口暂时注释掉为了不报错
if(typeof(clock) != "undefined"){
/*bridge.callHandler('notificationList',clock,function(data){
alert(data);
});*/
}
//初始加载
loadMove();
noteLast();
//去掉当天记事最后一条的线
function noteLast(){
$(".time-list").each(function (i, obj) {$(obj).find(".text-in").eq(-1).css('border-bottom','0');});
}
//向上滑动或者点击加载更多方法
function loadMove(){
//判断不同入口，添加记事有无
if($(".add").length == 0){
$(".notelist-content").css("margin","44px 0 0");
}
$(".notelist-content").on("swipeUp",function(){
var stop1=$(window).scrollTop();
var ttop=$("#last-note").offset().top;
var wtop=$(window).height();
if(stop1+wtop > ttop){
$(".loadingmove").css('display','inline-block');
$(".addmove").text('正在加载中');
var lastid = $(".noteli").eq(-1).attr("textclick");
var listParam = 'lastId='+ lastid +'&start=0&length=10';
$.ajax({
url:urlMap.jsUrl,
type:'POST',
data:listParam,
dataType: 'json',
//async:false,
success: function(data){
if(data.errorcode == 0){
$("#last-note").before(data.result.html);
$(".loadingmove").css('display','none');
//$(".addmove").text('记事已经加载完毕');
noteLast();
}else{
alert(data.errormsg);
}
},
error:function(data){
alert(data.errormsg);
}
});
}
});
}
//点击进入(编辑页)详细页
$(".noteli").live('tap',function(){
if($(".delete").css("display") == "inline-block"){
return false;
}else{
location.href = $(this).attr('link');
}
});
//点击整理
$("#arrange").tap(function(){
$(".list-hd-delete").show();
$(".list-hd").hide();
$(".delete").show();
$(".notelist-content").off();
});
//选中复选框
$(".delete").live('tap',function(){
var pids = $(this).attr('value');
//alert(pids);
delCheck();
});
//选中复选框个数
function delCheck(){
if($(".delete").css("display") == "inline-block"){
var del = $(".notelist-content").find(".delete");
var m = 0;
var n = false;
for(var i=0;i<del.length;i++){
if(del[i].checked){
n = true;
m ++;
}
}
$(".num").text(m);
}
}
//点击取消
$(".cancelbtn").tap(function(){
$(".list-hd-delete").hide();
$(".list-hd").show();
$(".delete").css('display','none');
loadMove();//再次加载更多
delCheck();
});
var checkeds = [];
//点击删除
$("#alldelete").tap(function(){
var checked = $("input[name='checks']:checked");
checked.each(function (i, input){
checkeds.push($(this).val());
});
var deleteUrl = getStockDiaryDeleteUrl(checkeds);
$.ajax({
url:deleteUrl,
type:'POST',
data:{ids:checkeds},
dataType: 'json',
success: function(deletemes){
if (deletemes.errorcode == 0) {
$("input[name='checks']:checked").parents(".time-list").remove();
alert("删除成功");
}else{
alert(data.errormsg);
}
},
error: function (deletemes) {
alert(deletemes.errormsg);
}
});
});
//返回
$("#backnote").tap(function(){
//返回到上一层也就是手机同花顺主页或者是个股页面暂时先注释
//bridge.callHandler('exit',JSON,function(){})
});
});