jQueryの：複数の 'ほろ酔い' ツールチップ

Question

私は私のデータベースからの結果のリストを取り戻す、彼らはそうのように表示されます。

結果1
結果2
結果3

そんなこと...今、jQuery Tipsyプラグインが動作しています。結果1の上にカーソルを置くと、ユーザーの名前が表示されます。問題は、結果2にカーソルを合わせるとTipsyのツールチップが表示されるはずですが、通常のブラウザのツールチップを表示するだけです。

idが結果にあるので、aタグは同じ名前です： 'east'です。私はjQueryで各チェックのために何らかの処理をする必要があると思いますが、jQueryでこれをどこに追加するのかについてはあまり気にしません。

誰にも解決策がありますか？

Answer 1

あなたの問題は3つのaタグすべてに同じIDを持っています。同じページ上の複数の要素に同じIDを適用することは、いかなる状況下でも受け入れられません。それを修正する必要があります。

<a href="result_one.html" id="result_one" class="tipsy">Result 1</a> 
<a href="result_two.html" id="result_two" class="tipsy">Result 2</a> 
<a href="result_three.html" id="result_three" class="tipsy">Result 3</a> 

あなたはすべての3つのaタグに同じクラスを適用して、クラスにほろ酔い適用することができます。

$(document).ready(function() { 
    $('.tipsy').tipsy({fade:true,gravity:'n'}); 
}); 

各IDは別々に行うこともできます。

$(document).ready(function() { 
    $('#result_one').tipsy({fade:true,gravity:'n'}); 
    $('#result_two').tipsy({fade:true,gravity:'n'}); 
    $('#result_three').tipsy({fade:true,gravity:'n'}); 
});