javascript - Jqueryプラグインホバーカードは動的に生成されたコンテンツでは機能しません

Question

JqueryプラグインHovercardは、単純なHTMLコードではうまく機能しますが、JavaScriptコードで使用した場合は機能しません（javascriptを介して動的にhtmlコードを作成します）。たぶんこれも一般的な問題ですが、jsコードで生成されたコンテンツでjqueryプラグインはどのように機能しますか？

Answer 1

あなたのコードを見たことがないので、これが役立つかどうかはわかりません。しかし、JS で HTML を動的に追加する際の問題は、結果の DOM 要素に必要なイベント ハンドラーが関連付けられていないことです (ホバーカード、mouseover、mouseoutおよびおそらく他の要素の場合)。解決策は、追加した後$(...).hovercard({...})に新しく追加された DOM 要素を呼び出すことです。例えば

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

このブロックの後、aタグはホバーカード効果を持ちます。hovercard()のいくつかの要素を呼び出すと$(document).ready()、イベントが発生したときに存在する要素のみDOMContentLoadedが効果を持ちます (後で追加する要素は影響を受けません)。