3

サイトで「簡単なヒント」jQuery ツールチップ コードを使用しています。これは、インデックス ページでは正常に機能していますが、AJAX 経由で読み込んでいる外部ページでは機能していません。

ここでライブの例を参照してください (削除済み - ライブではありません)。カテゴリ アイコンでは機能していることがわかりますが、下のボックスの 5 つの画像では機能していません。このコンテンツを個別にロードすると機能しますが。(/特集.html)

ここで、AJAX がロードされたページで jQuery を使用するというテーマで検索しましたが、次のような人が言及しているのを見てきました。

.live()

しかし、次のようなツールチップ コードに実装する方法がわかりません。

function simple_tooltip(target_items, name){
$(target_items).each(function(i){
    $("body").append("<div class='"+name+"' id='"+name+i+"'><p>"+$(this).attr('title')+"</p></div>");
    var my_tooltip = $("#"+name+i);

    if($(this).attr("title") != ""){ // checks if there is a title

    $(this).removeAttr("title").mouseover(function(){
            my_tooltip.css({opacity:0.8, display:"none"}).fadeIn(50);
    }).mousemove(function(kmouse){
            my_tooltip.css({left:kmouse.pageX-15, top:kmouse.pageY+30});
    }).mouseout(function(){
            my_tooltip.fadeOut(50);
    });

    }
});
}

$(document).ready(function(){
 simple_tooltip("a","tooltip");
});    

誰かが私を正しい方向に向けるのに十分親切でしょうか?

前もって感謝します!

4

1 に答える 1

1

ajaxを使用してコンテンツをロードした後、単純なツールチップを再度バインドするとうまくいくと思います

 $("#youdDiv").load("serverpage.php",function(){
    simple_tooltip("a","tooltip");
  });
于 2012-03-18T00:10:11.040 に答える