javascript - 单击行的 Jquery 切换元素

Question

这应该是一个客户端列表，您可以在其中单击行来选择它们，然后将它们提交到数据库以供 cron 作业选择它们并向它们发送电子邮件。

我正在尝试突出显示行而不是使用复选框，这就是为什么我放置了两个隐藏元素一个用于客户端 ID，另一个 - bool 用于检查行是否已被单击。

我不知道如何切换特定行的元素值(选中)。

<table>
<tbody>
<tr class="contactrow">
<input type="hidden" name="id" value="995"/>
<input type="hidden" name="checked" value="FALSE"/>
<td>Andrew Ostrich</td>
<td>AO Company</td>
<td>7537535</td>
<td>ao@aocompany.com</td>
</tr>
<tr class="contactrow">
<input type="hidden" name="id" value="296"/>
<input type="hidden" name="checked" value="FALSE"/>
<td>Brendon Evans</td>
<td>Institute of Modern Arts</td>
<td>648648468</td>
<td>bevans@ioma.co.uk</td>
</tr>
<tr class="contactrow">
<input type="hidden" name="id" value="421"/>
<input type="hidden" name="checked" value="FALSE"/>
<td>Rudy Thompson</td>
<td>Marine CORP</td>
<td>95939288</td>
<td>Rudee@mcorp.es</td>
</tr>
</tbody>
</table>

​还， http://jsfiddle.net/FHjAc/

Answer 1

部分问题是服务器无法识别哪些客户端 ID 已被检查。所有 input[type=checkbox] 共享相同的 name 属性，该属性用于标识每个参数。

如果将 name 属性更改为 checked[__ID__]，则可以循环参数并将这些记录提交到数据库。

在 PHP 中，您将执行以下操作。

<?php

$checked = $_POST['checked'];

foreach( $checked as $id ) {
  // do something with the $id here
}

更新

我没有意识到您在选中的字段中使用了隐藏输入。如果您将其更改为复选框，您的工作应该会容易得多。

HTML 这就是我标记 HTML 的方式，您可以使用 CSS 来隐藏带有 display: none 的复选框。

<tr class="contactrow">
  <td>
    <input type="checkbox" name="checked[421]" />
    Rudy Thompson
  </td>
  <td>Marine CORP</td>
  <td>95939288</td>
  <td>Rudee@mcorp.es</td>
</tr>

jQuery

$(function () {
  $('.contactrow').click(function () {
    var checkbox = $(this).find('input[type=checkbox]');
    checkbox.prop('checked', !checkbox.prop('checked'));
    $(this).toggleClass('contactrow_highlight');
  });  
});