javascript - 如何在应用表单函数之前等待表单加载？

Question

我的网站上有一个结账按钮，可以动态加载表单，用户可以在其中填写他/她的个人详细信息。该表单的 id 为#order。加载表单后，它必须从 jquery-form 调用 .submit 函数。插入。

当我第一次做到这一点时，它不起作用，所以我使用了我最低限度的调试技能(放置警报，我不知道最好的方法;-))。当我在表单加载和 .submit 调用之间发出警报时，它突然起作用了。

我认为这与调用 .submit 之前表单未完全加载有关。但经过快速搜索后，我发现 .html 函数是同步的，因此任何代码在 .html() 调用之后执行肯定会在 html 之后发生已设置。

有人可以帮我解决这个问题吗？

$('.checkout').live('click', function(event) {
  event.preventDefault();                       
  $.get('/gva/templates/gva/form.html', function(data){
    $('#blog').html(data);
  });
  alert('with this alert it works, without it doesn't'); 

  var options = { 
    target:        '#response',   
    beforeSubmit:  validate,  
    success:       showResponse  
  };

  $('#order').submit(function() { 
    $(this).ajaxSubmit(options); 
    return false; 
  });
});

Answer 1

$('.checkout').live('click', function(event) {
  event.preventDefault();                       
  $.get('/gva/templates/gva/form.html', function(data){
    $('#blog').html(data);

    var options = { 
      target:        '#response',   
      beforeSubmit:  validate,  
      success:       showResponse  
    };

    $('#order').submit(function() { 
      $(this).ajaxSubmit(options); 
      return false; 
    });
  });
});

警报导致了延迟，这确保了 DOM 在代码的下一部分触发时已更新。我已将它们放入适当的处理程序中，以便它们在适当的时间触发。