我目前有一个表,当单击一行时,我想模拟单击 GV 表上的同一行。这是监听器。
$(".mytable tbody tr td").click(function() {
var colIndex = $(this).parent().children().index($(this));
var rowIndex = $(this).parent().parent().children().index($(this).parent());
google.visualization.events.trigger(chart, 'select', null);
});
这会正确触发选择事件,但我需要的是能够像这样在回调中获取行。
google.visualization.events.addListener(chart, "select", function() {
var selection = chart2.getSelection();
var item = selection[0];
console.log(item, selection);
});
当单击 GV 表项目时,该项目包含一个具有行和列的对象。如何在特定行上触发表上的选择并使其与单击自身一样?
我确实找到了一种方法来做到这一点,但我更希望能够对两条路线使用相同的代码。
$(".mytable tbody tr td").click(function() {
var colIndex = $(this).parent().children().index($(this));
var rowIndex = $(this).parent().parent().children().index($(this).parent());
google.visualization.events.trigger(chart, 'select', {"row": rowIndex, "col": colIndex});
});
google.visualization.events.addListener(chart, "select", function(data) {
if(typeof data["row"] != "undefined") {
item = data;
}
else {
var selection = chart2.getSelection();
var item = selection[0];
}console.log(data, item);
});
我也尝试过使用 jquery 来点击正确的单元格(这将是理想的)。
$(".google-visualization-table .top-level table tbody tr:eq(" + rowIndex + ") td:eq(" + colIndex + ")").click();
最佳答案
以下将 DOM 表上的点击与 google 可视化表同步:
$(".mytable").on('click', 'tbody td', function(e) {
chart.setSelection([{row: e.toElement.parentNode.rowIndex-1}]);
google.visualization.events.trigger(chart, 'select', {});
})
select
事件在 GV 表上被触发,就像它本身被点击一样。
演示 -> http://jsfiddle.net/7v487nhf/
注意:您只能选择整行或多行,因此无需设置 col
- 无论如何都会以 null
结束。
关于javascript - 使用 Google 可视化如何在特定行上触发选择事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30673638/