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

Question

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

请找到小提琴http://jsfiddle.net/0w9yo8x6/16/

当我鼠标移到该行中的图像，显​​示工具提示和工具提示上测试点击后，JavaScript函数invoked.I想将行的值传递给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

我相信这就是你0123'我冒昧地修改你的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，但是基本的想法是在逻辑中捕获的。

Answer 2

我猜这就是你在说什么。

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); 
} 

希望这可以帮助，让我知道如果我误解了。