javascript - Not to open a new page when table check box is clicked

Question

I have this JavaScript which opens new page when I click on a table row:

$(document).ready(function () {
    $('table[id$="dataTable"]').find("tbody").on("click", "tr", function () {
        $(this).find('a[id$="lnkHidden"]').trigger("click");
    }).on("click", 'a[id$="lnkHidden"]', function (e) {
        e.stopPropagation();
    });
});

The JavaScript is used to call this button:

<h:commandLink id="lnkHidden" action="#{bean.pageRedirect}" style="text-decoration:none; color:white; display:none">
        <f:setPropertyActionListener target="#{bean.sessionValue}" value="#{item.value}" />
    </h:commandLink>

The code works well but it turns out that when I select the first column of the table which is a check box I also open a new page. How I can modify the JavaScript not to open a new page when the check box is clicked?

Answer 1

侦听对表格单元格而不是行的点击，然后忽略该单元格是否在第一列中。

坚持使用 jQuery，这可能有效：

$(document).ready(function () {
    $('table[id$="dataTable"]').find("tbody").on("click", "td", function () {
        if (this.cellIndex > 0) {
            $(this.parentNode).find('a[id$="lnkHidden"]').trigger("click");
        }
    }).on("click", 'a[id$="lnkHidden"]', function (e) {
        e.stopPropagation();
    });
});