[英]Selecting A radio buttons to add another input in jquery/javascript
我正在尝试通过将所学知识付诸实践来学习jQuery。 所以,这是我的编码问题。
我有两个按钮,一个“是”和一个“否”。 选择“是”单选按钮后,将出现一个新的文本输入。
我的jquery如下:
$(document).ready(function(){
$("#many").hide();
var isChecked = $("#dform input" ).change(function() {
$("input[name=question]:checked", "#dform").val();
if(isChecked == yes){
$("#many").show();
}else {$("#many").hide();}
});
});
我的密码笔
我用这个答案在变量中添加了value函数,然后在条件语句中使用了它。 我把值$("input[name=question]:checked", "#dform").val();
在警报中,以确保已捕获附加到“是”单选按钮的值。 但是,当我将.val()函数放在变量中并在条件语句中使用它时,它将不起作用。
我是否正确设置了Jquery?
试试这个
<script>
$(document).ready(function () {
$("#many").hide();
$("input[name='question']").click(function () {
if ($('#yes').is(':checked')) { $("#many").show(); }
else { $("#many").hide(); }
});
});
</script>
您有点偏离轨道了。 您无需命名onChange处理程序( var isChecked...
),我认为这使您感到困惑。 我会尝试一些类似的方法:
$(document).ready(function(){
$("#many").hide();
$("#dform input[name=question]").change(function() {
if ($('#dform input[name=question]:checked').attr('value') == 'yes') {
$("#many").show();
} else {
$("#many").hide();
}
});
});
试试这个隐藏和显示元素
$(document).ready(function(){
$("#many").hide();
$("#dform input" ).change(function() {
$("#many").show();
});
$("#no").change(function(){
$("#many").hide();
})
});
将html更改为:
<input type="radio" name="question" id="no" value="no" checked>
有不同的方法可以做到这一点,用Jquery addClass和Remove Class方法来做到这一点很简单
**HTML**
<h4>
Click on button to toggle
</h4>
<div style="padding:10px;">
<button class="show btn">Show</button>
<button class="hide btn">Hide</button>
</div>
<div>
<input type="text" id="name" class="displayN"/>
</div>
jQuery的
$(document).ready(function(){
$(".show").click(function(){
$("#name").addClass('displayB').removeClass("displayN");
});
$(".hide").click(function(){
$("#name").addClass("displayN").removeClass("displayB");
})
});
请用以下代码替换您的js:
$(document).ready(function(){
$("#many").hide();
$("#dform input" ).change(function() {
var val = $("input[name=question]:checked", "#dform").val();
if (val == "yes") {
$("#many").show();
} else {
$("#many").hide();
}
});
});
我敢肯定它可以被清理更多,但无论如何它都能正常工作。 jQuery设置很好。 代码笔: http : //codepen.io/anon/pen/GqxGmp
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.