jQuery：将 ajaxForm 绑定到通过 .load() 加载的页面上的表单答案

【问题标题】：jQuery: Bind ajaxForm to a form on a page loaded via .load()jQuery：将 ajaxForm 绑定到通过 .load() 加载的页面上的表单
【发布时间】：2011-01-13 14:41:36
【问题描述】：

我正在使用 jQuery 的 ajaxForm 插件在我的 web 应用程序上提交表单。但是，在应用程序的一部分中，我正在通过 jQuery 的 .load() 加载一些带有表单的内容

问题在于我无法让 ajaxForm 绑定到通过 ajax 加载的表单。

我试过这段代码无济于事：

 $('#viewRecordBtn').live('click', function() { // Handle the event when the 'view record' button is clicked
    $("#tab2").load('ajax/viewRecord.php'); // Load the record and the form into tab 2
    $('#formAddRecord').ajaxForm(formAddRecordOptions); // Bind the form
 });

非常感谢任何帮助！

编辑：谢谢大家！这非常有效。

【问题讨论】：

标签： jquery ajax forms bind ajaxform

【解决方案1】：

$('#viewRecordBtn').live('click', function() { 
   $("#tab2").load('ajax/viewRecord.php', function(){
       $('#formAddRecord').ajaxForm(formAddRecordOptions); // Bind the form
   }); // Load the record and the form into tab 2

});

【讨论】：

【解决方案2】：

我认为你应该将绑定代码放入回调中，因为加载是异步的：

 $('#viewRecordBtn').live('click', function() { // Handle the event when the 'view record' button is clicked
    $("#tab2").load('ajax/viewRecord.php', function() {
                    $('#formAddRecord').ajaxForm(formAddRecordOptions); // Bind the form
               }); // Load the record and the form into tab 2    
 });

【讨论】：

【解决方案3】：

那是因为您在 .load() 尚未完成时绑定 ajaxForm。试试这个：

$('#tab2').load('ajax/viewRecord.php', function() {
  $('#formAddRecord').ajaxForm(formAddRecordOptions);
});

【讨论】：

【解决方案4】：

如果您使用最新的 jQuery 表单插件和 jQuery 1.7+，您可以使用“委托”选项，如下所示：

$('#myForm').ajaxForm({
    delegation: true,
    target: '#output'
});

这里有描述：http://malsup.github.com/jquery.form.js

【讨论】：

感谢您的简单解决方案！