我有一個帶有資料屬性的 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
第一次使用
.data()存取data-*屬性時，該屬性的值由jQuery 內部緩存，並且.data()從那時起就使用快取。使用.attr()更新屬性不會更新緩存，您需要使用.data()來更新它。這就是為什麼你需要使用$(element).data('location', count);更新它。