我有一個 HTML DIV，它由 ajax 函數使用 setinterval 進行更新。我想做的是將class添加到ajax的結果中。但是當 setinterval 時，添加的類將被重置并顯示初始類。如何解決這個問題。<html><body><div id="something"></div><script>$(document).ready(function(){var id;setInterval(function(){somepage(); addactiveclass(); }, 5000);function somepage(){$.ajax({ url:"fetchcontents.php", method:"POST", success:function(data){ $('#something').html(data); } })}function addactiveclass(){$('#list-'+id).addClass("active");}// UPDATED$(document).on('click', '.mycontents', function(){id = $(this).data('id');$('#list-'+id).addClass("active");}});</script></body></html>更新： fetchcontents.php<?php $output .= '<div class="list-item mycontents" data-id="'.$row['id'].'" data-name="'.$row['username'].'" id="list-'.$row['id'].'">';//.... some php function to generate some contents inside the above div.....// Contents do not interfere with this question.$output .= '</div>';echo $output;?>發生的情況是活動的 class 沒有添加到 div 中id="list-'.$row['id'].'"。如您所知，setinterval 在 5 秒后繼續執行 ajax 函數，并且活動類被重置并且不顯示。誰能指導我完成這個問題。
1 回答
GCT1015
TA貢獻1827條經驗 獲得超4個贊
我剛剛在 jsfiddle 中運行了你的代碼，但用一個字符串替換了 ajax，將新的 div 定義為 #something 的內容，并且它有效。
然而它確實需要我將 js 放入 $(document).ready 塊中
$(document).ready(function() {
//your js in here
})
嘗試一下。其作用是在渲染所有 HTML 之前不定義 js。我的猜測是您在 #something 存在之前引用了它。
編輯：===============================================
自從我寫完答案以來，您已經對代碼進行了很大的更改，但是為了支持我的主張，以解決我認為是您的問題，我重新完成了我的 jsfiddle 測試：https: //jsfiddle.net/uf5h0sgw/
<html>
<body>
<div id="something">AAAA</div>
<script>
$(document).ready(function(){
var id;
var cnum = 1;
setInterval(function(){
somepage();
addactiveclass();
}, 1000);
function somepage(){
$('#something').html('<div class="abc">BBBB</div>');
/*$.ajax({
url:"fetchcontents.php",
method:"POST",
success:function(data){
$('#something').html(data);
}
})*/
}
function addactiveclass(){
/*$('#list-'+id).addClass("active"); */
$('#something div').addClass("active" + cnum++)
}
});
</script>
</body>
</html>
我無法重現您的 ajax 響應，因此我剛剛添加了一些代碼，以便在每次間隔到期時將 DIV 插入到 #something 中（測試時減少到 1000 毫秒）。
然后函數addactiveclass()改變已經添加的Div的類。我在每個循環的計數器上更改類名稱，以便您可以看到該類每次都會更新。
顯然，您必須調整我的代碼來處理 AKAX 添加的任何內容，但該方法應該實現我認為您想要的效果。
- 1 回答
- 0 關注
- 179 瀏覽
添加回答
舉報
0/150
提交
取消