jQuery表单在部分内容被取消时不起作用

Question

我正在建立一个多面搜索，在该搜索中序列化表格数据并用于确定要使用的内容load()。我有两个主要部分，即侧边栏（.sidebar）和结果区域（.results），所有部分都包装在wrapper（.wrap）div中。

var mainContent = .results

$('#facets').change(function(e){
    mainContent.load('?' + formData + ' .results');
    e.preventDefault();
});

当我以这种方式执行它时，表单将继续按预期运行（将结果异步加载到change（）上。）

…但是 也必须加载表单，这一点很重要 ，因为搜索结果会动态填充这些方面。

当我将mainContent变量更改为整个包装器分区时…

var mainContent = .wrap

$('#facets').change(function(e){
    mainContent.load('?' + formData + ' .wrap');
    e.preventDefault();
});

..表单首次提交更改，但是在通过将其拉入DOM后停止响应ajax。

我想念什么？

Answer 1

使用 委托事件
，因为元素在DOM加载后通过ajax加载：

$(document).on('change','#facets',function(e){
    mainContent.load('?' + formData + ' .wrap');
    e.preventDefault();
});