Jquery:选择表行时选择一个单选按钮

前端之家收集整理的这篇文章主要介绍了Jquery:选择表行时选择一个单选按钮前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
用户点击表格行中的任何位置时,我需要选择一个单选按钮.我一直在玩一些选项,但无法得到任何工作.

任何帮助表示赞赏.

这是一个示例表:

  1. <table id="tableSelect" class="rowclick" border=1>
  2. <caption align="top">User Management</caption> <thead>
  3. <tr id='head'>
  4. <th scope="Row">Select</th>
  5. <th>User Name</th>
  6. <th>Greeting Name</th>
  7. <th>Dept</th>
  8. <th>User Name</th>
  9. <th>Access Level</th>
  10. </tr>
  11. </thead>
  12. <tbody>
  13. <tr id='one'>
  14. <th scope="col">
  15. <input name="UserSelected" id="userSelected_1" type="radio" value="1">
  16. </th>
  17. <th scope="col"> Richard Rice</th>
  18. <td>Rick</td>
  19. <td>IT</td>
  20. <td>rick</td>
  21. <td>
  22. <select class="Role" id="Role" name="userAccessLevel">
  23. <option value="-2">Access Denied</option>
  24. <option value="-1">Suspended</option>
  25. <option value="1">Shipping User</option>
  26. <option value="2">Administrator</option>
  27. <option value="3" selected>Super Administrator</option>
  28. <option value="5">Accounting</option>
  29. <option value="6">Report Viewer</option>
  30. </select>
  31. </td>
  32. </tr>
  33. <tr id='two'>
  34. <th scope="col">
  35. <input name="UserSelected" id="userSelected_2" type="radio" value="3">
  36. </th>
  37. <th scope="col"> Mickey Hockenberry</th>
  38. <td>Mickey</td>
  39. <td>Purchasing</td>
  40. <td>mickeyh</td>
  41. <td>
  42. <select class="Role" id="Role" name="userAccessLevel">
  43. <option value="-2">Access Denied</option>
  44. <option value="-1">Suspended</option>
  45. <option value="1">Shipping User</option>
  46. <option value="2" selected>Administrator</option>
  47. <option value="3">Super Administrator</option>
  48. <option value="5">Accounting</option>
  49. <option value="6">Report Viewer</option>
  50. </select>
  51. </td>
  52. </tr>
  53. <tr id='three'>
  54. <th scope="col">
  55. <input name="UserSelected" id="userSelected_3" type="radio" value="41">
  56. </th>
  57. <th scope="col"> Michael Lynch</th>
  58. <td>Mike</td>
  59. <td>Shipping</td>
  60. <td>mjl</td>
  61. <td>
  62. <select class="Role" id="Role" name="userAccessLevel">
  63. <option value="-2">Access Denied</option>
  64. <option value="-1">Suspended</option>
  65. <option value="1">Shipping User</option>
  66. <option value="2" selected>Administrator</option>
  67. <option value="3">Super Administrator</option>
  68. <option value="5">Accounting</option>
  69. <option value="6">Report Viewer</option>
  70. </select>
  71. </td>
  72. </tr>
  73. </tbody>

解决方法

用这个:
  1. $('#tableSelect tr').click(function() {
  2. $(this).find('th input:radio').prop('checked',true);
  3. })

这是一个工作小提琴:http://jsfiddle.net/mrchief/eFnL7/1/

编辑:为了更好(通过多少??)性能,使用input [type = radio]选择器:http://jsfiddle.net/mrchief/eFnL7/2/

猜你在找的jQuery相关文章