jQuery和单选按钮选择_Jquery_Radio Button_Selectedindexchanged

jQuery和单选按钮选择

jquery

jQuery和单选按钮选择,jquery,radio-button,selectedindexchanged,Jquery,Radio Button,Selectedindexchanged,我有一个ASP.NET页面，它将使用Html控件呈现这样的页面（抱歉，编程呈现在办公室）： jQuery单选按钮第一组第2组函数ClickEvent（r）{ } 在ClickEvent函数中，我需要做的是使用jQuery选择组（也称为名称）。然后，如果他们选择了错误的选项（value=“false”），请将单选按钮的边框更改为红色，并始终将正确答案的边框更改为绿色。然后禁用按钮组我应该在函数定义中加入什么来实现这一点？我在jQuery方面没有什么背景知识（我在前面提到过，

我有一个ASP.NET页面，它将使用Html控件呈现这样的页面（抱歉，编程呈现在办公室）：


jQuery单选按钮
第一组







第2组







函数ClickEvent（r）{
}

在ClickEvent函数中，我需要做的是使用jQuery选择组（也称为名称）。然后，如果他们选择了错误的选项（value=“false”），请将单选按钮的边框更改为红色，并始终将正确答案的边框更改为绿色。然后禁用按钮组

我应该在函数定义中加入什么来实现这一点？我在jQuery方面没有什么背景知识（我在前面提到过，但被告知要使用它），但从我所读到的内容来看，我认为“每个”都可能是正确的方法。我还被告知不用麻烦使用CSS类，只需更改边框颜色即可。我可以使用回发来完成这项工作，但他们说必须是客户端的。有人能帮忙吗

p、事实上，这是ASP.NET可能是无关紧要的。如果您知道jQuery，请随时发布答案。

试试这个（更改标记和脚本以非结构化方式绑定单击事件）：


第一组







第2组







$（函数（）{
$（“div:radio”）。单击（ClickEvent）；
});
函数ClickEvent（）{
var el=这个；
变量$el=$（el）；
如果（$el.val（）=“false”）{
var all=$（“[name=”+$el.attr（“name”）+“]”）；
var correctRadio=all.filter（“[value='true']”）；
更正收音机。换行（“”）；
$el.wrap（“”）；
全部。道具（“禁用”，正确）；
} 
}

工作示例：

非常感谢您！如果初始选择为true，我会根据您的代码添加一个else语句，但是如果没有您的示例，我就无法完成它。再次感谢！

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>jQuery Radio Buttons</title>
</head>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<body>
<form id="form1" runat="server">
<div>
    Group 1<br />
    <input type="radio" name="Q1" id="rb1" title="Choice 1" value="false" onclick="javascript:ClickEvent(this);" /><br />
    <input type="radio" name="Q1" id="rb2" title="Choice 2" value="true" onclick="javascript:ClickEvent(this);" /><br />
    <input type="radio" name="Q1" id="rb3" title="Choice 3" value="false" onclick="javascript:ClickEvent(this);" /><br />        
    Group 2<br />
    <input type="radio" name="Q2" id="rb4" title="Choice 1" value="false" onclick="javascript:ClickEvent(this);" /><br />
    <input type="radio" name="Q2" id="rb5" title="Choice 2" value="false" onclick="javascript:ClickEvent(this);" /><br />
    <input type="radio" name="Q2" id="rb6" title="Choice 3" value="true" onclick="javascript:ClickEvent(this);" /><br />
</div>
</form>
</body>
</html>
<script type="text/javascript">
function ClickEvent(r) {

}
</script>

<div>
Group 1<br />
<input type="radio" name="Q1" id="rb1" title="Choice 1" value="false" /><br />
<input type="radio" name="Q1" id="rb2" title="Choice 2" value="true" /><br />
<input type="radio" name="Q1" id="rb3" title="Choice 3" value="false" /><br />        
Group 2<br />
<input type="radio" name="Q2" id="rb4" title="Choice 1" value="false" /><br />
<input type="radio" name="Q2" id="rb5" title="Choice 2" value="false" /><br />
<input type="radio" name="Q2" id="rb6" title="Choice 3" value="true" /><br />
</div>


<script type="text/javascript"> 
    $(function(){
     $("div :radio").click(ClickEvent);
    });
    function ClickEvent(){
            var el = this;
            var $el = $(el);
            if($el.val() == "false"){
                var all = $("[name='" + $el.attr("name") + "']");
                var correctRadio = all.filter("[value='true']");
                correctRadio.wrap("<span style='border: solid Green 2px'></span>");
                $el.wrap("<span style='border: solid Red 2px'></span>");
                all.prop("disabled", true);
            } 
        }


</script>