关键字与用户完成输入的Ajax

时间:2016-11-13 19:01:32

标签: jquery ajax timer

我想知道这是否可能是我想要的:

我有一个表格,它也是一个看起来像这样的表格:

Exercise  |  Reps  |  Lbs  |   Kg
-------------------------------------
Squat     |    8   |  135  |  61.23
Squat     |    8   |  225  |  102.06
Squat     |    6   |  315  |  142.88
Squat     |    2   |  405  |  183.70
Squat     |    1   |  485  |  219.99

其中'Reps','Lbs'和'Kg'值均可由用户编辑。

我遇到了这个问题。我不想在每个keyup事件上发送ajax请求,我也不希望有一个提交按钮。我已经实现了一个计时器,一旦用户停止键入2秒(或多长时间),它就会更新。但是,我遇到的问题是我不能在不同的行之间分隔这个计时器。让我解释一下:

如果在我的上表中,如果我用135lbs编辑顶行,它将1)立即适当更新Kg&& 2)开始倒数计时器。

如果我开始编辑225lbs的下一行,计时器将重新开始,这意味着第一行不​​会更新。

可能的解决方案是允许计时器重新开始每次新编辑,但是当它最终完成时,然后更新所有内容。但这似乎也是一种浪费,因为从技术上讲,我的数量或行数可能是无限的。

我已经考虑过将一个类添加到任何更改的类中,然后只更新那些类...但是,如果他们更新一个然后再次更新回原来的那个...那么它也没有需要更新。

有关如何处理此事的任何建议?

1 个答案:

答案 0 :(得分:2)

您可以执行以下操作:

  1. 当输入值更改时,在keyup(或粘贴)上设置计时器。
  2. 当输入失去焦点(并且已经改变)时立即进行ajax调用。
  3. 关键是正确取消计时器并在必要时中止ajax调用。

    sudo apt-get remove --auto-remove python-pip  
    

    注意:您需要中止ajax调用的原因是(非常)罕见的情况,第二个ajax调用在第一个ajax调用之前返回。如果您没有中止第一个ajax调用,则在处理响应时,您将使用无效值更新页面。