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

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

任何帮助表示赞赏.

这是一个示例表:

<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/

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

总结

以上是脚本之家为你收集整理的Jquery:选择表行时选择一个单选按钮全部内容,希望文章能够帮你解决Jquery:选择表行时选择一个单选按钮所遇到的程序开发问题。

其他人正在看

如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您喜欢交流学习经验,点击链接加入脚本之家官方QQ群:1065694478
标签: