搜索

首页  >  问答  >  正文

jQuery获取数据属性时得到错误的值

我有一个带有数据属性的 div

<div class='p1' data-location='1'></div>

我有这样的脚本

$('button').click(function(){

    var loc = $('.p1').data('location');
    alert('data location is'+loc);//SHOW THE DATA

    var num = 10;
    var count = loc;
    var element = $('.p1');
    var intv = setInterval(anim,1000); 
    function anim(){
        count++;
        num--;
        if(count==37){count = 1;}
        if(num==1){clearInterval(intv);}
        $(element).animateCSS('bounceOut',{
            callback: function(){
                $(element).attr('data-location',count);
                $(element).animateCSS('bounceIn');
            }
        });

    }
    anim();

});

使用上面的脚本,数据位置属性将更新为 10,但如果我再次单击该按钮,数据位置仍然是 1

P粉052724364P粉052724364467 天前755

全部回复(1)我来回复

  • P粉183077097

    P粉1830770972023-11-02 15:33:37

    第一次使用 .data() 访问 data-* 属性时,该属性的值由 jQuery 内部缓存,并且 .data() 从那时起就使用缓存。使用.attr()更新属性不会更新缓存,您需要使用.data()来更新它。这就是为什么你需要使用

    $(element).data('location', count);

    更新它。

    回复
    0
  • 取消回复