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

Question

我正在使用 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
 });

非常感谢任何帮助！

---

编辑：谢谢各位！这完美地工作。

Answer 1

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

 $('#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    
 });

Answer 2

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

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

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

Answer 3

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

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

Answer 4

$('#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

});