Question

但是当我在setInterval中加载时它不起作用，这就是test.php里面的内容：

<div id="refresh">
<textarea></textarea>
</div>


<script src="jquery.js"></script>
<script>
$(function () {
  var timerId = 0;

  $('textarea').focus(function () {
    clearInterval(timerId);
  });

  $('textarea').blur(function () {
    timerId = setInterval(function () {
     $('#refresh').load('test.php #refresh');
    }, 1000);
  });
});
</script>

Answer 1

问题在于，您的load调用会销毁并重新创建textarea，并且没有任何内容会将事件处理程序附加到新textarea。您附加的处理程序仅附加到原始处理程序，而不是新的替换程序。

您可以使用事件委派来解决这个问题，因为jQuery会确保blur和focus冒泡（即使它们不会在所有浏览器上本地冒泡）;

$(function () {
  var timerId = 0;

  $('#refresh').on('focus', 'textarea', function () {
    clearInterval(timerId);
  });

  $('#refresh').on('blur', 'textarea', function () {
    timerId = setInterval(function () {
     $('#refresh').load('test.php #refresh');
    }, 1000);
  });
});

挂钩#refresh元素上的事件，但仅当事件源自其后代textarea时才触发处理程序。

或者因为没有理由反复查找refresh：

$(function () {
  var timerId = 0,
      refresh = $("#refresh");

  refresh.on('focus', 'textarea', function () {
    clearInterval(timerId);
  });

  refresh.on('blur', 'textarea', function () {
    timerId = setInterval(function () {
     refresh.load('test.php #refresh');
    }, 1000);
  });
});

请注意，此更改还表示<{1}} textarea中只有#refresh元素获取事件，而使用原始代码时， all <页面上的/ em> div元素得到了它。

如何在内部加载时停止“setInterval”

1 个答案: