手机记事项目

做的一个手机项目，进入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(){})
});

});