本文介绍了选择单选按钮时显示 div的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
我是 javascript 和 jQuery 的新手.在我的 html 中有 2 个单选按钮和一个 div.如果我检查第一个单选按钮，我想显示该 div，否则我希望它被隐藏
I am novice in javascript and jQuery. In my html have 2 radio buttons and one div. I want to show that div if I check the first radio-button but otherwise I want it to be hidden
so: 如果选中单选按钮#watch-me --> div #show-me 可见.如果单选按钮#watch-me 未选中(既未选中也未选中第二个)--> div #show-me 被隐藏.
so: If radio button #watch-me is checked --> div #show-me is visible. If radio button #watch-me is unchecked (neither are checked or the second is checked) --> div #show-me is hidden.
这是我目前所拥有的.
<form id='form-id'>
<input id='watch-me' name='test' type='radio' /> Show Div<br />
<input name='test' type='radio' /><br />
<input name='test' type='radio' />
</form>
<div id='show-me' style='display:none'>Hello</div>
和 JS:
$(document).ready(function () {
$("#watch-me").click(function() {
$("#show-me:hidden").show('slow');
});
$("#watch-me").click(function(){
if($('watch-me').prop('checked')===false) {
$('#show-me').hide();}
});
});
我应该如何更改我的脚本来实现这一点?
How should I change my script to achieve that?
推荐答案
我会这样处理:
$(document).ready(function() {
$('input[type="radio"]').click(function() {
if($(this).attr('id') == 'watch-me') {
$('#show-me').show();
}
else {
$('#show-me').hide();
}
});
});
这篇关于选择单选按钮时显示 div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！