0

この例に従って、ツールチップをフロート グラフに追加しようとしています。しかし、ツールチップは表示されません。

$(document).ready(function(){
    $("#plotarea").bind("plothover", function (event, pos, item) {
        $("#x").text(pos.x.toFixed(2));
        $("#y").text(pos.y.toFixed(2));
        if (item) {
          $("#charttooltip").remove();
        var x = item.datapoint[0].toFixed(2),
        y = item.datapoint[1].toFixed(2);
        showChartTooltip(item.pageX, item.pageY,'tooltip text to display');
        } else {
          $("#charttooltip").remove();
        }
    });
});

function showChartTooltip(x, y, contents) {
        $('<div id="charttooltip">' + contents + '</div>').css( {
              position: 'absolute',
              display: 'visible',
              'z-index': 100,
              top: y + 5,
              left: x + 5,
              border: '1px solid #bfbfbf',
              padding: '2px',
              'background-color': '#ffffff',
              opacity: 1                              
        }).appendTo($('#main_body')).fadeIn(200);
        } 
</script>

<div class="main_body"> //->is present in the html

showChartTooltip メソッドが呼び出されているかどうか、firebug で確認しました。これは機能します。コードをステップ実行すると、すべてが期待どおりに機能しているように見えますが、appendTo 呼び出しが成功したかどうかを firebug で誰が判断できるかはわかりません。

ツールチップが表示されないので、これが最初に確認したかったことです。これが問題ではないことを確認するために、非常に高い z-index も挿入しました。

誰かが他に何が間違っているのか考えているなら..コメントをいただければ幸いです。

4

2 に答える 2

1

firebug で HTML パネルを開き、body 要素を展開します。id=charttooltip の div が追加されている場合、メソッドは機能します。これが問題かどうか教えてください。

于 2010-01-26T11:30:36.467 に答える
1

s などがコードに実際に存在する場合、&lt;それはほぼ間違いなくあなたの問題です。パラメータとして実際の html を記述する必要があります。

$('<div id="charttooltip">' + contents + '</div>')
于 2010-01-26T11:32:00.560 に答える