jQuery - 将 onclick 添加到 TR答案

【问题标题】：jQuery - add onclick to TRjQuery - 将 onclick 添加到 TR
【发布时间】：2011-06-04 15:26:03
【问题描述】：

我使用 Richfaces，其中一个 Rich:dataTable 生成了这个 html：

<form id="scheduleForm">
  <table id="scheduleForm:rowList">
    <tr>
      <td></td>
    </tr>
    <tr>
      <td></td>
    </tr>
    <tr>
      <td></td>
    </tr>
  </table>
</form>

我想在单击此表的 TR 时采取行动。我怎样才能做到这一点？以下内容也适用于页面上的其他表格，我也收到了其他行的 alert()，但我不希望这样。

        jQuery('#scheduleForm:rowList tr').click(function(event) {
            alert(1);
        });

关于 ':' 字符。它由 Richfaces 生成。

原代码为：

<h:form id="scheduleForm">
<rich:dataTable id="rowList">
</rich:dataTable>
</h:form>

【问题讨论】：

我认为“：”可能在这里播放一些东西。如果我没记错的话，“：”是一些元字符，在选择器中有一些含义。

标签： jquery jsf richfaces

【解决方案1】：

您可以执行以下操作，给 tr 一个 id。

<form id="scheduleForm">
  <table id="scheduleForm:rowList">
    <tr id="tr1">
      <td></td>
    </tr>
  </table>
</form>

jQuery('#tr1').click(function(event) {
    alert(1);
});

【讨论】：

这很明显，但我认为使用 JSF 和 RichFaces 在上强制执行 id 并不容易......
谢谢，我忘了说可以有更多行。我想要该表的所有行。

【解决方案2】：

试试下面的方法，对你有帮助。

jQuery(document.getElementById('scheduleForm:rowList').getElementsByTagName('tr')).click(function(event) {
          alert(1);
        });

【讨论】：

【解决方案3】：

尝试使用：

jQuery('#scheduleForm:rowList>tr').click(function(event) {
            alert(1);
        });

最好不要在id属性的值中使用charter“：”。我不太清楚

【讨论】：

【解决方案4】：

我知道: 是由 JSF / RichFaces 生成的。我之前也遇到过: 的问题。这可能不是 jQuery 人员在 ID 中所期望的。他们将它用于选择器。您可能想要做的是：

jQuery('table[id = "scheduleForm:rowList"] tr').click(...)

查看http://jee-bpel-soa.blogspot.com/2009/04/tips-and-tricks-on-jquery-and-richfaces.html

【讨论】：

【解决方案5】：

您的 ID 属性中有一个冒号 :。冒号在 jQuery 选择器中有特殊的含义，所以你需要像这样转义它：

jQuery('#scheduleForm\\:rowList tr').click(function(event) {
      alert(1);
});

【讨论】：

【解决方案6】：

: 由 JSF 生成。您还可以在表单上设置 prependId="false"。然后只需使用：

jQuery('#rowList tr').click(function(event) { alert('hello'); });

并且只会选择该表。

【讨论】：

【解决方案7】：

jQuery("#rowList").on("click", "tr", function(event) { 
    alert($(this).id); 
});

【讨论】：

虽然此代码可能会回答问题，但提供有关它如何和/或为什么解决问题的额外上下文将提高答案的长期价值。