0

ツールチップライブラリは、domノードをコピーして、ツールチップ内にhtmlを挿入しています。

ツールチップ内の要素をターゲットにする必要がありますが、javascriptは常に元の要素に適用されます。

 <a class="tooltip">Open</a>

<div class="tooltip-html" style="display:none;">
<div id="main-content" class="scroll">
    <div class="Content">
        <div class="blue">
        </div>
    </div>
</div>

ツールチップのenterコールバックを使用してみましたが、機能しませんでした。また、ツールチップによってhtmlがコピーされる前に適用すると、見た目だけが機能しますが、javascriptはまだ元の文字を参照しています。javascriptを適用する前に、クラスを変更してみました。クラスを変更した場合、元の要素にアクセスできなくなります。クラスは変更されましたが、ツールチップ内にあるものにはjavascriptが適用されませんでした。

コピーされたdivを削除する良い方法、または正しい要素を見つけてターゲットにするより良い方法はありますか？

$(this).find("div.scroll").test();

編集：

...Before...
    <div id="main-content" class="scroll">
    <div class="Content"> 

...After...

<div id="tiptip_holder" style="max-width: 230px; margin: 23px 0pt 0pt 999px; display: none;" class="tip_left_bottom">
<div id="tiptip_arrow" style="margin-left: 220px; margin-top: -12px;">
<div id="tiptip_content">
    <div id="main-content" class="scroll">
    <div class="Content"> 
    ....

これは、ツールチップライブラリのenterコールバックの一部でした。

 var tip_html = $('.tooltip-html').html();
    $('.tooltip').tipTip({ content: tip_html, enter: function(){
        $(this).find("div.scroll").test();

    }

また、使用してみました、

$("#main-content.scroll", "#tiptip_content").test();

アップデート：

親divに私がやるべきように名前を付けると言われたように、ツールチップ内でターゲットを設定できない例を次に示します。

jsfiddle.net/mstefanko/pUm5V/24

//$("#main-content", "#tooltip-content").css("background", "red");
$("#main-content", "#tiptip_content").css("background", "blue");

青は機能しませんが、赤は機能します。両方のラインが機能するように感じます。

4

1 に答える 1

0

私の問題の主な原因を見つけました。プラグインの次の行： 

function active_tiptip(){
    opts.enter.call(this);        
    tiptip_content.html(org_title);

ツールチップのラッパーが存在する限り、ツールチップコンテンツがDOMに含まれる前に、enter呼び出しが呼び出されていました。ツールチップに含まれていないときにメインコンテンツを呼び出すと、明らかに機能しなくなります。問題を完全に解決したかどうかはわかりませんが、これらの行を逆にすると、当面の問題が修正されます。

于 2012-04-23T18:31:19.283 に答える