Jquery插件hovercard在动态生成的内容中不起作用

Question

Jquery插件Hovercard在简单的HTML代码中效果很好，但是当我在javascript代码中使用它时（通过javascript动态创建html代码）不起作用。也许这也是一个普遍的问题，jquery插件如何在js代码生成的内容中工作？

Answer 1

我没有看到你的任何代码，所以我不能确定这会有所帮助。但是，使用JS动态添加HTML的问题在于，生成的DOM元素不会附加必要的事件处理程序（在Hovercard，mouseover，mouseout以及其他可能的情况下）。解决方法是在添加之后，在新添加的DOM元素上调用$(...).hovercard({...})。 e.g。

$("body").append("<a class='hovercard'>New element.</a>");
$("body a.hovercard").hovercard({...});

在此块之后，a标记将具有Hovercard效果。如果您对hovercard()中的某些元素发送$(document).ready()，那么仅 DOMContentLoaded事件触发时存在的那些元素将产生效果（不是任何元素）稍后再添加。）