Ajax 调用后 JS 库不工作

Question

我有一个 Ajax 电话，returns 一些 HTML 代码。在此返回的代码中，我有几个下拉框使用 select2 JavaScript 库等（公司库、自定义库等）

现在，none 个库似乎在从 Ajax 调用检索到的内容中完全起作用。

类似问题的解决方案可以通过使用 jQuery 委托方法来解决（根据提出的其他问题），但在这种情况下，我不能简单地进入 select2 库（也不能进入所有其他库）那些）并用委托替换所有内容。

为了让库处理返回的 ajax 内容，我可以实施哪些解决方案？

Answer 1

如果您通过 AJAX 将 html 加载到页面中，您将需要运行新 html 上的初始化函数：

//from the docs
$('select').select2();

如果您正在使用 jQuery.load，您可以这样做：

 //load the html into #result
 $( "#result" ).load( "demo.html", function() {
    //now use 'this' in the selection to search the new html and init select2
    $('select',this).select2();
 });

或者，要使用委托，您可以等到单击（或自定义事件）后再次初始化 select2，但我认为在这种情况下您不需要这样做。

Ajax 调用后 JS 库不工作

JS libraries not working after Ajax call

html

javascript

ajax

jquery

jquery-select2