我有这个html:
<td>
<div class="status">1</div>
<span class="fa fa-times-circle" aria-hidden="true"></span>
</td>
我有这个脚本:
<script>
$('.status:contains("1") + span').removeClass('fa-times-circle').addClass('fa-sun-o');
</script>
该脚本基本上根据 div 1 或 0 的文本删除和添加类。但是,该脚本仅运行 10 秒,然后恢复为显示 fa-times-circle 的默认类。当另一个脚本(见下文)每 10 秒间隔重新加载数据时,它就会停止。
<script>
(function updateStafftable() {
$.get('sql/staff-status.php', function(data) {
$('.table-staffs').html(data);
setTimeout(updateStafftable, 10000);
});
})();
</script>
你们知道为什么吗?另外,我想指出的一个重要细节是,我在开头提到的 html 位于“staff-status.php”中,它每 10 秒间隔重新加载一次。我只是不明白为什么会发生这种情况。
最佳答案
你的方法不好,但如果你想以最小的改变实现你的目标,那么将该脚本放在ajax调用的成功中
<script>
(function updateStafftable() {
$.get('sql/staff-status.php', function(data) {
$('.table-staffs').html(data);
$('.status:contains("1") + span').removeClass('fa-times-circle').addClass('fa-sun-o');
setTimeout(updateStafftable, 10000);
});
})();
</script>
Better way
编辑staff-status.php
中的逻辑,通过添加if
条件来根据状态分配类,例如
...
if($status == 1){
$class= 'fa-sun-o';
}else{
$class= 'fa-times-circle';
}
....
<td>
<div class="status">$status</div>
<span class="fa $class" aria-hidden="true"></span>
</td>
....
关于javascript - 当另一个脚本重新加载页面时,Jquery 脚本停止工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43862200/