js——单选框radio

页面：

... <tr align="right">
                <td align="right">会员性别：</td>
                <td align="left">
                    <input type="radio" name="sex" id="sex1" size="20" value="1">男 <input type="radio" name="sex" id="sex2" size="20" value="2">女 </td>
            </tr> ...

 

                                                                   

   需求：点击性别时，变换不一样的头像；

   误区：一直觉得，只要是选中radio的事件再给它附上相应的图片就行，因而起初是这样的：

... if(jQuery("input[type='radio']:checked").val() == 1){ jQuery("#imgSrc").attr("src", "/static/admin/img/default_man.png"); } else { jQuery("#imgSrc").attr("src", "/static/admin/img/default_woman.png"); } ...

但是事与愿违，任我怎样选，它也不会改变图片，这是什么缘由呢？缘由就是本身忘记给radio写单独的事件了，click()或者change()事件，以致于单选框怎样改变也不会让图片改变。最终就成了：

... jQuery("input[type='radio']").change(function () { if(jQuery("input[type='radio']:checked").val() == 1){ jQuery("#imgSrc").attr("src", "/static/admin/img/default_man.png"); } else { jQuery("#imgSrc").attr("src", "/static/admin/img/default_woman.png"); } }); ...

这样，任你怎样点击性别，自动就会改变下面的默认头像。