jQuery：按钮在 ajaxForm 返回的 html 中不起作用 - 如何重新绑定？答案

【问题标题】：jQuery: button not working in html returned by ajaxForm - how to rebind?jQuery：按钮在 ajaxForm 返回的 html 中不起作用 - 如何重新绑定？
【发布时间】：2010-10-25 01:41:24
【问题描述】：

试图让按钮在第二种表单中工作（jQuery UI chrome 和 jQuery 功能），该表单位于由第一个表单调用的 ajaxForm 返回的 html 中。该按钮以第一种形式工作 - jQuery UI chrome 可见并且 ajaxForm 事件有效。对于第二个表单，按钮是通用的，ajaxForm 不起作用，它提交到表单中定义的目标，而不是通过 jQuery。我认为我的问题涉及 bind() 或 delegate() 或 live() 但我只是不明白如何重新绑定。这是我的代码：

// prepare Options Object for first form submit of new program
     var options = { 
     target:     '#add_program_container', 
     success:    function (response) {
              jQuery('#add_program_container').html(response);
        }
     }; 

     // pass options to ajaxForm for first form sumit of new program

     jQuery('#new_program_form').ajaxForm(options);

      // prepare Options Object for second form submit of new program - requirements
     var options = { 
      target:     '#add_program_container', 
      success:    function (response) {
         jQuery('#add_program_container').html(response);

         }
     }; 

     // pass options to ajaxForm for second form submit of new program - requirements

     jQuery('#new_program_form_two').ajaxForm(options);

按钮：

jQuery('#next_button').button({
      icons: { secondary: 'ui-icon-carat-1-e' }
     });

html（ajaxForm返回一个表单，这是使用jQuery UI的按钮）

<button id="next_button" type="submit">Next</button>

非常感谢任何帮助！

【问题讨论】：

标签： jquery button ajaxform dynamic-rebinding

【解决方案1】：

我认为这种方法使用绑定。你应该使用直播：

$("#next_button").live('click', function() { // 你的代码 });

【讨论】：

【解决方案2】：

我在 document.ready 函数中添加了一个名为 initBinding() 的函数，并在初始绑定时调用它：

jQuery(document).ready(function() {

initBinding();

//functions for initial bind

function initBinding() {

    //other functions to rebind after ajax success, can be same functions called initially
}
}

【讨论】：