<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
* {margin:0;padding:0}
</style>
<script src="jquery-1.11.3.min.js"></script>
<script>
//本月总天数 今天 本月第一天是星期几?
$(function(){
var now=0;//本月
function run(n){//每次把月份传进来
var oDate=new Date();
oDate.setMonth( oDate.getMonth()+n ); //每次都要设置月;
var year=oDate.getFullYear();
var today=oDate.getDate();//今天
var month=oDate.getMonth();//3
oDate.setDate(1);//日期调整到本月第一天
var first_week=oDate.getDay();//获取本月第一天的星期
oDate.setMonth(month+1,0);//日期调整到本月最后一天
var last_date=oDate.getDate();//获取本月最后一天的日期
var allDays=last_date;
var last_week=oDate.getDay();//获取本月最后一天的星期
oDate.setMonth(month,0);//日期调到上个月最后一天
var pre_date=oDate.getDate();//获取上个月最后一天的日期
$('.dateList').empty();
//插入前月的天数
for(var j=first_week-1; j>=0; j-- ){
$('.dateList').append('<li class="ccc">'+(pre_date-j)+'</li>');
};
//插入本月天数
for(var i=0;i<allDays; i++){
$('.dateList').append('<li>'+(i+1)+'</li>');
};
if(last_week!=6){
for(var i=1;i<=6-last_week; i++){
$('.dateList').append('<li class="ccc">'+i+'</li>');
}
}
var aLi=$('.dateList li');
aLi.each(function(i){
var _this=$(this);
if(n==0&&i>=first_week&&i<last_date+first_week){
if(_this.text()<today){
_this.addClass('ccc');
}
else if(_this.text()==today){
_this.addClass('red');
}
else{
if(i%7==0 || i%7==6){//7个一模
_this.addClass('sun');
}
}
}else if(n<0){
_this.addClass('ccc');
}else if(n>0&&i>=first_week&&i<last_date+first_week){
if(i%7==0 || i%7==6){//7个一模
_this.addClass('sun');
}
}
});
$('h4').text(year+'年'+(month+1)+'月');
$.ajax({
url:"note_arr.txt",
type:"GET",
dataType:"json",
success:function (data){
for(var i=0;i<data.length;i++){
if (data[i].month == month+1 && data[i].year == year ){
console.log(month)
aLi.eq(data[i].date + first_week - 1).addClass("ac").prop("id",data[i].id)
}
}
$.data=data;
},
error:function (textStatus,errorThrown) {
alert(textStatus);
}
})
};
//首次运行
run(now);
//----------------------------------------------------
$('.a1').click(function(){
now--;
run(now);
//console.log(arr1)
});
$('.a2').click(function(){
now++;
run(now);
});
$('.dateList').on("click",".ac",function () {
//alert($(this).data("note_cont"))
for(var i=0;i<$.data.length;i++){
if ($.data[i].id == $(this).prop("id") ) {
console.log(i)
alert($.data[i].note_cont);
}
}
})
});
</script>
</head>
<body>
<p id="calendar">
<h4>2013年10月</h4>
<a href="javascript:;" class="a1">上月</a>
<a href="javascript:;" class="a2">下月</a>
<ul class="week">
<li>日</li>
<li>一</li>
<li>二</li>
<li>三</li>
<li>四</li>
<li>五</li>
<li>六</li>
</ul>
<ul class="dateList">
</ul>
</p>
</body>
</html>
以上这种方式,在每一次点击的时候满足条件的属性的时候,会多次弹出需要的值,但当我把$('.dateList').on("click",".ac",function () {
//alert($(this).data("note_cont"))
for(var i=0;i<$.data.length;i++){
if ($.data[i].id == $(this).prop("id") ) {
console.log(i)
alert($.data[i].note_cont);
}
}
})
这段拿到外面之后,只弹出一个值?
问题:ajax中监听的点击事件会产生叠加吗?
请防止重复点击