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

发布于 2024-09-29 01:32:25 字数 1379 浏览 9 评论 0原文

尝试让按钮在第二个表单中工作（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>

非常感谢任何帮助！

原文

Trying to get a button working (jQuery UI chrome and jQuery functionality) in a second form that is in the html returned by ajaxForm that has been called on a first form. The button works in the first form - the jQuery UI chrome is visible and the ajaxForm event works. For the second form, the button is generic and ajaxForm does not work, it submits to the target defined in the form not via jQuery. My problem I think involves bind() or delegate() or live() but I am just not understanding how to rebind. Here is my code:

// 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);

The Button:

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

The html(a form is returned by ajaxForm, this is the button using jQuery UI)

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

Any help is much appreciated!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

自我难过 2024-10-06 01:32:25

我认为这种方法使用了绑定。您应该使用 live:

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

回复收藏 0 原文

旧伤还要旧人安 2024-10-06 01:32:25

我向 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
}
}

I added a function called initBinding() to the document.ready function and called it at the initial bind:

jQuery(document).ready(function() {

initBinding();

//functions for initial bind

function initBinding() {

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

回复收藏 0 原文

~没有更多了~