Question

我有这个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＆＃39;每隔10秒重新加载一次。我只是不明白为什么会这样。

Answer 1

你的方式并不好，但如果你想用最小的改变来实现你的目标，那么就把这个脚本放在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>

更好的方式

编辑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>
    ....

当另一个脚本重新加载页面时，Jquery脚本停止工作

1 个答案: