如何仅使表格的一列可点击答案

【问题标题】：How to make only one column of a table clickable如何仅使表格的一列可点击
【发布时间】：2018-11-30 07:32:03
【问题描述】：

我正在尝试使表格单元格可单击，以便我可以提取单元格值（成员 ID）并将其提交到服务器，然后将用户重定向到显示该成员个人资料数据的新页面。我使用以下代码将表格的单元格委托为可点击，但它使所有单元格都可点击，我只希望第一列单元格可点击。

ID 的单元格数据为：

<td align="center" class="member_id" id="member_id" >
   <?php echo $wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 0, $cur_row); ?>
</td> <!--- ID --->

JS文件为：

$jq("#mem_dir").delegate("td", "click", function() {
   alert("Clicked on a cell");
   if ($jq(this).hasClass("member_id")) {
      alert("Clicked on a member ID");
   var member_id = $jq(this).text();
   alert ("Member ID is: " + member_id);
}

我真的很想为电子邮件地址单元格数据做我所做的事情，但还没有弄清楚如何去做。

可点击的电子邮件单元格数据：

<td><?php echo make_clickable($wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 3, $cur_row)); ?></td> <!--- email --->

感谢您的任何帮助或建议。

【问题讨论】：

标签： cell clickable

【解决方案1】：

实际上，这比我想象的要简单得多。我只是将委托方法的选择器更改为感兴趣的列的类：

$jq("#mem_dir").delegate(".member_id", "click", function() {
    var member_id = $jq(this).text();
    var member_id = member_id.trim();
    alert ("ID is: " + member_id);

在类上使用一点 CSS 来在将鼠标悬停在单元格上时创建一个指针都可以正常工作：

#member_id {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

【讨论】：