如何在用户选择时在父div上应用Jquery的CSS？
如何在用户选择时在父div上应用Jquery的CSS？
提问于 2012-02-02 03:38:22
如何使用Jquery添加用户选择的类？
我的Aspx标记如下。
<div id="Answer" class="Ans">
<div id ="Left">
<asp:RadioButton ID="rdAnsBool1" runat="server" Text = '<%# DataBinder.Eval(Container.DataItem, "Ans1") %>' />
<asp:RadioButton ID="rdAnsBool2" runat="server" Text = '<%# DataBinder.Eval(Container.DataItem, "Ans2") %>' />
<asp:RadioButton ID="rdAnsBool3" runat="server" Text = '<%# DataBinder.Eval(Container.DataItem, "Ans3") %>' />
<asp:RadioButton ID="rdAnsBool4" runat="server" Text = '<%# DataBinder.Eval(Container.DataItem, "Ans4") %>' />
<asp:RadioButton ID="rdAnsBool5" runat="server" Text = '<%# DataBinder.Eval(Container.DataItem, "Ans5") %>' />
<asp:RadioButton ID="rdAnsBool6" runat="server" Text = '<%# DataBinder.Eval(Container.DataItem, "Ans6") %>' />
<asp:HiddenField ID="HiddenField1" runat="server" Value = '<%# DataBinder.Eval(Container.DataItem, "Ans1Bool") %>'/>
<asp:HiddenField ID="HiddenField2" runat="server" Value = '<%# DataBinder.Eval(Container.DataItem, "Ans2Bool") %>'/>
<asp:HiddenField ID="HiddenField3" runat="server" Value = '<%# DataBinder.Eval(Container.DataItem, "Ans3Bool") %>'/>
<asp:HiddenField ID="HiddenField4" runat="server" Value = '<%# DataBinder.Eval(Container.DataItem, "Ans4Bool") %>'/>
<asp:HiddenField ID="HiddenField5" runat="server" Value = '<%# DataBinder.Eval(Container.DataItem, "Ans5Bool") %>'/>
<asp:HiddenField ID="HiddenField6" runat="server" Value = '<%# DataBinder.Eval(Container.DataItem, "Ans6Bool") %>'/>
</div>
</div>访问者可以通过选择“获奖问题”单选按钮来选择答案。
HiddenFields包含true或false
因此，如果用户选择答案，并且答案的值为"True"，则JQuery应该将一个“正确的”CSS类添加到ID = rdAnsBool1的父div中
如果用户选择答案，并且答案的值为"False"，则JQuery应该向父div添加一个“错误”的CSS类，ID = rdAnsBool1
在您的回答中，请记住以下标记是在列表视图中呈现的
这是JSFiddle链接
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-02-02 03:46:35
就像FYI一样，隐藏字段值在HTML检查器中是可见的，所以不是存储秘密答案的最佳位置。
假设你的ID和名字保持不变(这不是个好主意，但不管怎样)……
这是可行的：http://jsfiddle.net/VTevz/6/
$(function() {
$('input[name$="answers"]').change(function() {
// clear all the previous classes
$('input[name$="answers"]').parent().removeClass('correct').removeClass('wrong');
// get the index of the selected answer
var i = $('input[name$="answers"]').index(this);
// get the value of the corresponding correct answer
var answer = $('input[type="hidden"]:eq(' + i + ')').val();
// check if it's true and add the appropriate class
if (answer == 'True') $(this).parent().addClass('correct');
else $(this).parent().addClass('wrong');
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9102091
复制相关文章
相似问题
腾讯云开发者
