当在表行中选择 true 或 false 单选按钮时,我想根据单击的单选按钮显示特定图像。我在这里做了一些警报,发现我什至没有识别该图像,更不用说更改它的可见性了。
这是 HTML:
<tr>
<td>This is a bit answer</td>
<td>
<label>
<input checked="checked" data-StudentScore="ScoreBit" id="StudentScores_0__ScoreBit" type="radio" value="" />
Not answered
</label>
<label>
<input data-StudentScore="ScoreBit" id="StudentScores_0__ScoreBit" type="radio" value="False" />
False
</label>
<label>
<input data-StudentScore="ScoreBit" id="StudentScores_0__ScoreBit" type="radio" value="True" />
True
</label>
</td>
<td class="met-image">
<img class="Img-Met" style="visibility:visible" alt="Met" src="/Images/tick_circle.png" />
</td>
<td class ="not-met-image">
<img class="Img-NotMet" style="visibility:hidden" alt="Not Met" src="/Images/minus_red_button.png" />
</td>
这是我的脚本中不起作用的部分(我已经删除了“如果单击了这个或那个按钮”,因为这不是我的问题的一部分):
$(document).ready(function () {
$("input[type=radio]").click(function () {
$(this).closest('tr').find("td.met-image").find('img[alt="Met"]').attr('style', "visibility':'hidden'");
$(this).closest('tr').find("td.not-met-image").find('img[alt="Not Met"]').attr('style', "visibility':'visible'");
});
});
有人可以帮我找到与单击的单选按钮位于同一行的图像,并更改它们的可见性吗?仅供引用:这是在 MVC4 View 中。
最佳答案
您必须使用.css()
而不是.attr()
。实际上 .css()
是为了设置 css 样式属性而设计的。请阅读here了解更多信息。
尝试,
$(document).ready(function () {
$("input[type=radio]").click(function () {
$(this).closest('tr').find("td.met-image").find('img[alt="Met"]').css('visibility','hidden');
$(this).closest('tr').find("td.not-met-image").find('img[alt="Not Met"]').css('visibility','visible');
});
});
DEMO
关于jquery - 找到一个img并改变它的可见性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20615773/