Question

所以我有一个表单，我使用jquery post方法提交，并用ajax返回的数据替换分区的内容。这是代码：

    $(".filter_field").change(function() {
        $.post("/business/feedbacks/", $("#filter_form").serialize(),
            function(data) {
            $('#table-content').replaceWith($('#table-content', $(data)));
            });
    });

现在我遇到了这个方法的两个问题：

1）我还使用了一个重置按钮，它只是将表单的字段值重置为初始值，然后触发更改事件，如下面的代码所示：

      $('#filter_reset').click(function () {
            $(':input','#filter_form')
            .not(':button, :submit, :reset, :hidden')
            .val('')
            .removeAttr('checked')
            .removeAttr('selected');
            $(".filter_field").trigger('change');

      });

现在每当我点击重置按钮时，它都会重置表单的字段，并通过上述更改事件使用ajax提交表单。到目前为止一切顺利，但现在我无法再触发变更事件了。现在我在表单中点击了哪个字段，它只是不再使用ajax提交表单。

2）我在＃table-content division中安装了一个soundmanager插件（它的多个实例）。现在在ajax提交之后，该soundmanager插件停止工作，因为我假设，当soundmanager在ready事件中加载时，它在ajax submit和replaceWith之后不执行，因此它停止工作。

任何解决这些问题的解决方案？我是新来的询问，很抱歉，如果我做错了，请指导我正确的方向。非常感谢。

编辑：事实证明，如果我包含$ .getScript（＆＃34; /static/js/360player.js"）;它工作正常。是不是有一种方法将事件附加到使用jquery replaceWith命令替换的元素。＆＃39;在＆＃39;事件似乎根本不起作用。

Edit2：事实证明我正在使用＆＃39;在一个错误的师。我的坏:(

Answer 1

替换元素时，还会删除所有附加的事件处理程序。您需要使用委托将事件处理程序绑定到现有元素和 future elements ...

$("body").on("change", ".filter_field", function() {
    $.post("/business/feedbacks/", $("#filter_form").serialize(),
        function(data) {
        $('#table-content').replaceWith($('#table-content', $(data)));
        });
});

不确定您的第二个问题，但听起来也需要类似的方法。

脚本在jquery replaceWith之后停止工作

1 个答案: