次のようなJavaScriptでTwitterブートストラップツールチップを使用しています。
$('a[rel=tooltip]').tooltip();
私のマークアップは次のようになります。
<a rel="tooltip" title="Not implemented" class="btn"><i class="icon-file"></i></a>
これは正常に機能しますが、<a>
要素を動的に追加すると、それらの動的要素のツールチップが表示されません。通常のjquery$(document).ready(function()
機能を使用してドキュメントの読み込みが完了したときに、.tooltip()を1回だけバインドするためです。
これを動的に作成された要素にバインドするにはどうすればよいですか?通常、これはjquery live()メソッドを介して行います。ただし、バインドに使用するイベントは何ですか?ブートストラップ.tooltip()をjquery .live()に接続する方法がわかりません。
この作業を行う1つの方法は、次のようなものです。
/* Add new 'rows' when plus sign is clicked */
$("a.add").live('click', function () {
var clicked_li = $(this).parent('li');
var clone = clicked_li.clone();
clone.find(':input').each(function() {
$(this).val('');
});
clicked_li.after(clone);
$('a[rel=tooltip]').tooltip();
});
これは機能しますが、一種のハックのようです。$(ready)呼び出しでまったく同じ.tooltip()行も呼び出しています。それで、ページが最初にロードされ、そのセレクターと一致するときに存在する要素は、ツールチップで2回終了しますか?
このアプローチに問題はありません。私は、行動のベストプラクティスまたは理解を探しています。
これを試してください:
$('body').tooltip({
selector: '[rel=tooltip]'
});
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加