0

我正在使用 Twitter Bootstrap 模式来显示由 ajax 加载的表单。

我单击按钮以显示模式，顺便说一句，它将通过 ajax 获取其内容：

$('#team_join_modale_show').on('click', function(e) {
    e.preventDefault();
    var href = $(e.target).attr('href');

    $.get(href, function(data) {
        $(data).modal();
    });
});

然后，显示名为“#team_join_modal”的模式（之前不在 DOM 中）。上面有一个表格“#ajax_form_team_join”。

$('#team_join_modal').on('shown', function () {
    $('#ajax_form_team_join').ajaxForm({
        target:        '#errorTeamJoin',
        clearForm:     true
    });
});

问题是片段 $('#ajax_form_team_join').ajaxForm(); 从未执行，因此我的表单无法正常工作。

我尝试在我的 js 中移动事件，将 .on 更改为 .live，更改为新方法 .on，但没有结果。请问我缺少什么？

4

2 回答 2

1

您可以立即在成功的 AJAX 函数中绑定事件。

$('#team_join_modale_show').on('click', function(e) {
    e.preventDefault();
    var href = $(e.target).attr('href');
    $.get(href, function(data) {
        var $data = $(data);
        $data
          .on('shown', function () {
            $('#ajax_form_team_join', $data).ajaxForm({
              target: '#errorTeamJoin',
              clearForm: true
            });
          })
          .modal();
    });
});

不过，这可以更好地重构。

于 2012-05-13T17:43:15.567 回答
-1 
$('#team_join_modale_show').on('click', function(e){
    e.preventDefault();
    var href = $(e.target).attr('href');
    $.get(href, function(data) {
        $(data).modal();
    });
    $('#ajax_form_team_join').ajaxForm({
        target:'#errorTeamJoin',
        clearForm: true
    });
});

试试这个。

于 2012-05-13T14:56:15.167 回答