Question

我有一个表格，以报告的形式显示表格数据。我试图这样做，当你点击该行的任何地方时，它会导航到该特定项目的更详细视图。

HTML（来自PHP）

'<tr onClick="ViewItem(this, '.$ItemNum.')">'.
    '<td><input type="checkbox" name="chk_'.$ItemNum.'" /></td>'.
    '<td>a</td>'.
    '<td>b</td>'.
    '<td>c</td>'.
'</tr>'

的Javascript

function ViewItem(elThisRow, ItemNum)
{
    // If first <td> was clicked, return
    // ?

    // Otherwise, navigate to item
    window.location="/viewitem.php?i=" + ItemNum;
}

点击和导航部分运行正常，但唯一的是，第一个有一个复选框控件。

所以现在，我无法真正使用该复选框，因为当我点击它时页面会离开:(

有没有办法找出点击了哪个单元格，所以如果它是第一个单元格，我可以阻止它导航？

谢谢

Answer 1

event对象为您提供srcElement或target属性（取决于您是否使用IE），这样您就可以看到点击了哪个元素，从而忽略了点击次数输入元素：

'<tr onClick="ViewItem(event, this, '.$ItemNum.')">'.

function ViewItem(e, elThisRow, ItemNum) {
     if (!e) e = window.event;
     var target = e.srcElement || e.target;

     if (target.tagName.toUpperCase() === "INPUT")
         return;

     window.location="/viewitem.php?i=" + ItemNum;
}

演示：http://jsfiddle.net/LXeqV/

有关使用IE和其他浏览器处理事件之间差异的更多信息：http://www.quirksmode.org/js/events_properties.html

（当然，像jQuery这样的库会为你做跨浏览器的事情。）

Answer 2

我不懂PHP，但如果你想使用JQuery，它应该会更容易。只需将click事件绑定到每个td（列），然后根据列号

决定要执行的操作

当你点击表格行的第一个单元格时，javascript就知道了

2 个答案: