Question

有几次询问如何进行异步JSONP调用的问题。在我的情况下，我在事件队列中需要此功能。我正在使用jQuery.bind-first，以便将我的事件处理程序放到队列的开头。我需要在我的处理程序中进行jsonp调用，并在后续用户定义的处理程序中使用该调用的结果。

编辑以明确问题：如何在事件处理程序中创建异步ajax jsonp请求，确保在ajax请求完成之前不会执行事件队列的其余部分？

编辑：
我刚刚发现this几乎相同。在此方法中，发生表单提交等事件是因为调用该操作的表单上的最终提交事件不在事件队列中。

Answer 1

答案很简单。使用$ .event.trigger创建一个新的事件队列，将当前处理程序之后的所有事件处理程序绑定到新事件，在当前事件上停止传播，在jsonp调用成功时触发新事件。

// Bind our function to the event name
$('.selector').bindFirst(evnt_nm, {}, function(e){
  var that = this

  // Stop all propagation from this event queue
  e.preventDefault()
  if (e.stopImmediatePropagation) e.stopImmediatePropagation()
  if (e.cancelBubble!=null) e.cancelBubble = true
  e.stopPropagation()

  // Create the new my-queue event
  $.event.trigger({
    type: "my-queue",
    message: e,
    time: new Date()
  });

  // Copy this events queue
  // Using slice(0) creates a copy instead of a reference
  var events = $._data( $(this)[0] ).events[evnt_nm].slice(0)

  // Remove this event from the queue
  events.shift()

  // Bind the event handlers to the new queue
  $.each(events, function(index, event){
    $(that).bind('my-queue',event.handler)
  })

  // Make your jsonp call
  $.ajax({
    // ...
    success : function(data, textStatus, jqXHR){
      // ...
      // Trigger the rest of the events stored in the new queue once your finished.
      $(that).trigger('my-queue')
    }
  })

  return false;
})

现在，当你的事件被触发时，在jsonp调用成功返回之前，队列中的其余事件将不会被处理。

如何在事件队列中进行异步jsonp调用

1 个答案: