如何使用Firebug判斷appendTo調用是否成功/向浮動圖添加工具提示

Question

我正在嘗試按照此示例將工具提示添加到浮動圖。 但是工具提示沒有顯示。

$(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調用是否成功。

由於工具提示未顯示，這是我要檢查的第一件事。 為了確保這不是問題，我還插入了很高的z索引。

如果有人有什么主意，那還有什么錯。.非常感謝您的評論。

Answer 1

在firebug中打開HTML面板，然后展開body元素，如果添加了id = charttooltip的div，則該方法有效。 讓我知道這是否是問題。

Answer 2

如果< s等實際上存在於您的代碼中，那么幾乎可以肯定這是您的問題。 您需要編寫實際的html作為參數：

$('<div id="charttooltip">' + contents + '</div>')