如何使用 jQuery 进行后期绑定？答案

【问题标题】：How to do late binding with jQuery?如何使用 jQuery 进行后期绑定？
【发布时间】：2009-03-13 18:20:05
【问题描述】：

我有一个通过 XHR 引入的表单，我需要能够在其上绑定一个事件以进行提交。我已经下载了 jquery.form.js 插件。执行后期绑定的最佳方法是什么，以便我可以执行以下操作：

 $(document).ready(function() { 
        // bind 'myForm' and provide a simple callback function 
        $('#myForm').ajaxForm(function() { 
            alert("Thank you for your comment!"); 
        }); 
    });

很遗憾，由于在首次填充 DOM 时表单不可用，因此这不起作用。

** 编辑 **

我尝试在通过 XHR 检索表单后绑定到表单，但运气不佳。下面是它的外观：

 $.get("foo.php", function(data) { 
    $('#my_form').ajaxForm(function() { 
         alert("Thank you for your comment!"); 
     });
});

【问题讨论】：

标签： javascript jquery

【解决方案1】：

jQuery 1.3 引入了"Live" events，它将绑定到选择器定义的任何当前和未来元素。

我没有对它们做任何事情，但你应该能够做类似的事情似乎是合理的：

$(document).ready(function() {
    $('form').live("ready",function() {
        alert("Something");
    });
});

不确定在这种情况下 ready 事件是否真的有效，但似乎值得一试。

【讨论】：

【解决方案2】：

我认为你做得不对。我使用jquery表单的方式是这样的：

$('#myform').submit(function(){
 $(this).ajaxSubmit(function(){
  alert('Thanks for your comment');
 });
 return false
});

在表单被注入 DOM 之后调用它。另一种方法是使用来自jquery 的live 绑定

$('#myform').live('submit', function(){
 $(this).ajaxSubmit(function(){
  alert('Thanks for your comment');
 });
 return false
});

无论你选择哪种方式，你都必须将这段代码包含在$(document).ready()中

【讨论】：

【解决方案3】：

对 XHR 请求回调执行绑定。

【讨论】：

我已经尝试在它被带回 DOM 后绑定它，但运气不佳。

【解决方案4】：

在通过 XHR 加载表单后绑定事件。

【讨论】：