Werden sich Erfolgsereignisse in Ajax überschneiden?
迷茫
迷茫 2017-05-19 10:28:00
0
1
522

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
* {margin:0;padding:0}

Kalender{width:210px;margin:100px auto; overflow:hidden;border:1px solid #000; Polsterung:20px; Position:relativ}

Kalender h4{ text-align:center; margin-bottom:10px}

Kalender .a1{ position:absolute;top:20px;left:20px;}

Kalender .a2{ position:absolute;top:20px;right:20px;}

Kalender .week{height:30px; line-height:20px;border-bottom:1px solid #000; margin-bottom:10px}

calendar .week li{ float:left;width:30px;height:30px; text-align:center; Listenstil:none;}

calendar .dateList{ overflow:hidden; klar:beide}

calendar .dateList li{float:left;width:30px;height:30px; text-align:center; line-height:30px;list-style:none;position: relative;}

Kalender .dateList .ccc{ color:#ccc;}

Kalender .dateList .red{ Hintergrund:#F90; Farbe:#fff;}

calendar .dateList .sun{ color:#f00;}

calendar .dateList li::after{content: "";position: absolute;right: 0;top:0;width: 10px;height: 10px;border-radius:50%;display:none ;}

calendar .dateList li.ccc.ac::after{background:#ccc;display: block;}

calendar .dateList li.ac::after{background: red;display: block;}

calendar .dateList li.ac{cursor: pointer;}

</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中监听的点击事件会产生叠加吗?
迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

Antworte allen(1)
过去多啦不再A梦

请防止重复点击

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage