javascript - 排队表单提交请求直到服务器返回

Question

我有一个基于主干的 View ，用户可以在其中的文本字段中键入一个词并提交表单。有两个事件与 View 相关联 - submit 和 keyup。

class NewConceptView extends Backbone.View
  el: '#new-concept-cont'
  template: JST['concepts/new']

  events:
    'submit form': 'handleSubmit'
    'keyup #concept_title' : 'getPossibilities'

当用户键入时，我需要访问我的服务器并请求一些关于用户键入内容的数据(称为 possibilities)(就像自动完成插件一样)。

getPossibilities: (e) ->
  currentText = @titleInput.val() 
  if currentText.length > 0
    params = { text: currentText }
    $.getJSON(url, params, @buildConceptAttrs)

然后当用户提交表单时，我需要从服务器获取最后的可能性并将它们添加到集合中。

handleSubmit: (e) ->
  e.preventDefault()
  @titleInput.val('')
  @collection.create(@conceptAttrs)

当我在文本框中快速输入然后点击提交时，我遇到的问题就出现了。基本上，在所有可能的服务器请求返回之前提交表单。

有没有一种方法可以让我对提交事件进行排队，以便它们不会在所有可能性请求返回之前发生？

Answer 1

Is there a way that I should be queuing submit events 

嗯，我不知道应该，但我会使用的基本方法是:

1. 初始化 View 时，设置 this.outstanding_callbacks = 0;
2. 就在您调用 $.getJSON 之前，增加该变量 (this.outstanding_callbacks++)
3. 在@buildConceptAttrs 中递减 var (this.outstanding_callbacks--)
4. 当你去提交的时候，检查outstanding_callbacks；如果它 > 0，请不要提交。相反，执行 window.setTimeout(5000, retryFunction)，其中 5000 是您要等待的毫秒数，retryFunction 基本上是相同的函数(它可能实际上是相同的函数)

现在，您可能需要进行一些绑定(bind)或其他操作，以便您可以访问步骤 #3 和 #4 中的 View ，但希望这能给您一个大概的想法。