Question

我想将表格行 td 的值传递给工具提示上的javascript函数。

当我将鼠标悬停在行中的图像上时，会显示工具提示，当在工具提示上单击测试时，会调用javascript函数。我想在每次单击工具提示时将行的值传递给javascript函数。请建议。

我们可以使用td onclick事件来实现这一点，但是我的场景是不同的。当点击工具提示时，我们点击相应值的行应传递给javascript函数。

<table class="tooltipTable" style="position:absolute;">
    <tr><td> <span onclick="test()">test</span></td></tr>
</table>

<br/><br><br>
<table border="1">
<tr>
<td>Data1 <img class="one" src="http://ssl.gstatic.com/gb/images/b_5dae6e31.png" width="15" height="15" alt="" />
</td>
</tr>

<tr>
<td>Data2 <img class="one" src="http://ssl.gstatic.com/gb/images/b_5dae6e31.png" width="15" height="15" alt="" />
</td>
</tr>

<tr>
<td>Data3 <img class="one" src="http://ssl.gstatic.com/gb/images/b_5dae6e31.png" width="15" height="15" alt="" />
</td>
</tr>
</table>

Answer 1

我猜你正在谈论这个。

var display = function() { 
  var tooltip = [Create Tooltip Element];
  // Style tooltip etc.
  tooltip.addEventListener("click", function() {
    test(this.parentNode.innerHTML); // Test parent's inner HTML.
  }, false);
}

希望这有帮助，如果我误解了，请告诉我。

Answer 2

我相信你就是这样looking for我冒昧地修改了你的HTML。我在测试中添加了一个id，显示在工具提示表中。这是javascript工具提示

$(function() { 
var rowData;
$(document).tooltip({
    items: "img, [data-title]",
    content: function () {
        var element = $(this);
        if (element.is("img"))
         {
             rowdata = element.attr("data-title");
             $(document).off('click', '#test');
             $(document).on('click', '#test', function() {
                 test(rowdata);
             });

             $(document).off('click', '#display');
             $(document).on('click', '#display', function() {
                 display(rowdata);
             });
         }

        return $(this).prop('title');
    },
    show: null, 
    close: function (event, ui) {
        ui.tooltip.hover(

        function () {
            $(this).stop(true).fadeTo(1000, 1);
        },

        function () {
            $(this).stop(true).fadeOut(200, function () {
                $(this).remove();
            })
        });
    },
    position: {
        my: "left",
        at: "right"
    }
});
});

您可以对javascript进行改进，但在逻辑中捕获了基本想法。

将表数据的值传递给javascript函数

2 个答案: