Jquery:选择表行时选择单选按钮 [英] Jquery: Select a radio button when table row is selected
本文介绍了Jquery:选择表行时选择单选按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
当用户点击表格行中的任意位置时,我需要选择一个单选按钮。我一直在玩弄一些选项,但无法正常工作。
I need to have a radio button selected when a user clicks anywhere in a table row. I have been toying with some options but cannot get anything to work.
任何帮助都表示赞赏。
这里是一个示例表:
<table id="tableSelect" class="rowclick" border=1>
<caption align="top">User Management</caption> <thead>
<tr id='head'>
<th scope="Row">Select</th>
<th>User Name</th>
<th>Greeting Name</th>
<th>Dept</th>
<th>User Name</th>
<th>Access Level</th>
</tr>
</thead>
<tbody>
<tr id='one'>
<th scope="col">
<input name="UserSelected" id="userSelected_1" type="radio" value="1">
</th>
<th scope="col"> Richard Rice</th>
<td>Rick</td>
<td>IT</td>
<td>rick</td>
<td>
<select class="Role" id="Role" name="userAccessLevel">
<option value="-2">Access Denied</option>
<option value="-1">Suspended</option>
<option value="1">Shipping User</option>
<option value="2">Administrator</option>
<option value="3" selected>Super Administrator</option>
<option value="5">Accounting</option>
<option value="6">Report Viewer</option>
</select>
</td>
</tr>
<tr id='two'>
<th scope="col">
<input name="UserSelected" id="userSelected_2" type="radio" value="3">
</th>
<th scope="col"> Mickey Hockenberry</th>
<td>Mickey</td>
<td>Purchasing</td>
<td>mickeyh</td>
<td>
<select class="Role" id="Role" name="userAccessLevel">
<option value="-2">Access Denied</option>
<option value="-1">Suspended</option>
<option value="1">Shipping User</option>
<option value="2" selected>Administrator</option>
<option value="3">Super Administrator</option>
<option value="5">Accounting</option>
<option value="6">Report Viewer</option>
</select>
</td>
</tr>
<tr id='three'>
<th scope="col">
<input name="UserSelected" id="userSelected_3" type="radio" value="41">
</th>
<th scope="col"> Michael Lynch</th>
<td>Mike</td>
<td>Shipping</td>
<td>mjl</td>
<td>
<select class="Role" id="Role" name="userAccessLevel">
<option value="-2">Access Denied</option>
<option value="-1">Suspended</option>
<option value="1">Shipping User</option>
<option value="2" selected>Administrator</option>
<option value="3">Super Administrator</option>
<option value="5">Accounting</option>
<option value="6">Report Viewer</option>
</select>
</td>
</tr>
</tbody>
推荐答案
使用此:
$('#tableSelect tr').click(function() {
$(this).find('th input:radio').prop('checked', true);
})
这是一个工作小提琴: http://jsfiddle.net/mrchief/ eFnL7 / 1 /
Here's a working fiddle: http://jsfiddle.net/mrchief/eFnL7/1/
编辑:为了更好(多少?)性能,请使用输入[type = radio]
选择器: http://jsfiddle.net/mrchief / eFnL7 / 2 /
For better (by how much??) performance, use input[type=radio]
selector : http://jsfiddle.net/mrchief/eFnL7/2/
这篇关于Jquery:选择表行时选择单选按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文