将脚本绑定到动态创建的元素答案

【问题标题】：Binding a script to dynamically created elements将脚本绑定到动态创建的元素
【发布时间】：2016-10-06 01:17:04
【问题描述】：

我需要将占位符属性支持回 IE8。传统上，我发现这个脚本非常适合这样做：

但是它不绑定到动态创建的元素。所以如果用 JS 向页面添加新的输入，占位符将不起作用。

有没有办法将此脚本应用于动态创建的元素？

【问题讨论】：

【解决方案1】：

基本上..没有。

与大多数插件（不是严格基于事件的）一样，您需要在创建新元素后为其初始化插件。

在现代浏览器中，你可以使用 MutationObservers 之类的东西，但你需要这个插件的原因是为了支持旧浏览器，这样这个概念就行不通了

【讨论】：

【解决方案2】：

拨打jQuery.placeholder.shim(); 有效吗？这是在就绪/加载时调用的方法，因此可能会成功。

如果没有，那么您可能至少不能直接使用当前形式的特定插件。您可能会更改源来处理它。

它们是在页面加载时动态生成的吗？您能否简单地将插件的加载推迟到生成这些元素之后？

我唯一知道的另一个远景是，您能否将插件包装在一个函数中并在生成每个输入后调用它？这可能会产生意想不到的副作用，但可能是一种廉价且令人讨厌的替代方案。

【讨论】：

是的，进一步查看源代码，shim 方法看起来是最好的选择。它准备了一个配置对象，然后将其传递给 $.fn._placeholder_shim ，后者又完成了所有繁重的工作。您可能可以向 shim() 方法传递一个配置对象，指定一个选择器以仅针对新元素，即 jQuery.placeholder.shim({selector : 'input#newElement1'});
最后一个想法没有什么不好的......多年来一直这样做。很容易将一个类添加到已经设置的类中，并使用 not() 过滤掉它们
不，我的意思是再次重复调用整个插件，而不仅仅是实例化占位符的方法。如果它遍历页面上的每个输入并且不采用选择器，那么您最终会得到重复的事件处理程序和其他混乱等东西，将其应用于动态生成大量输入，那么您可以快速获得性能问题。在我写的时候，我没有注意到“shim”方法只有 jQuery.fn._placeholder_shim 方法，如果你通过 $('selector')._placeholder-shim() 调用它，它就不起作用，因为它需要一个配置对象。
同意选择器是重要的部分，但我认为 shim 公开的任何方法都不会采用传统 jQuery 风格的选择器，而是使用 config.selector 作为选择器。重复调用整个插件看起来并不像我想象的那么讨厌 - shim() 方法只会被调用一次，但这也可能意味着再次加载整个插件不会将其应用于动态生成的元素跨度>