单选input radio肯据所选调转

虽然简单做个笔记

 $('#step_1_tbody input[type=text]').on('click',function(){
      $(this).parent().parent().find('input[type=radio]')[0].checked=true;
    });

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>单选调转</title> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script> </head> <body> <div class="well col-md-8 col-lg-offset-2 col-md-offset-2"> <h2>找回密码</h2> <form action="" method="post"> <table class="table"> <tbody id="step_1_tbody"> <tr> <td colspan="4"><p>第一步：输入您的手机号或邮箱或用户名（三选一）</p></td> </tr> <tr> <th> <label for="phone"> <input type="radio" name="way" id="phone">手机号:</label> </th> <td colspan="3"> <input type="text" name="" id="phone-i" value="" class="form-control"> </td> </tr> <tr> <th> <label for="username"> <input type="radio" name="way" id="username">用户名:</label> </th> <td colspan="3"> <input type="text" name="" id="username-i" value="" class="form-control"> </td> </tr> <tr> <th> <label for="mail"> <input type="radio" name="way" id="mail">邮<span class="v_h">占</span>箱:</label> </th> <td colspan="3"> <input type="text" name="" id="mail-i" value="" class="form-control"> </td> </tr> </tbody> <tbody> <tr> <td colspan="4"><p>第二步：选择密码找回方式</p></td> </tr> <tr> <th> 密码发送到: </th> <td colspan="3"> <label for="r-phone"> <input type="radio" name="wayto" id="r-phone" checked="">手机号</label> <label for="r-mail"> <input type="radio" name="wayto" id="r-mail">邮箱</label> </td> </tr> <tr> <th>请输入验证码</th> <td><input type="text" class="form-control"></td> <td><img src="" class="verification"></td> <td><a href="javascript:void(0);">看不清，换一张</a></td> </tr> </tbody> </table> <input type="submit" value="找回密码" class="btn btn-warning btn-block submit"> </form> </div> <script type="text/javascript"> $('#step_1_tbody input[type=text]').on('click',function(){ $(this).parent().parent().find('input[type=radio]')[0].checked=true; }); </script> </body> </html>

提示：你可以先修改部分代码再运行。

转载请注明：有爱前端 » 单选input radio肯据所选调转