[英]How to confirm the chosen radio button?
我创建了三个单选按钮。 我想运行一个函数OnClick,要求用户确认所选的单选按钮,并告诉检查的单选按钮值是什么。 此外,如果用户未确认已选中的单选按钮,则将取消选择单选按钮。 这是我写的代码但失败了。
<input id="a1" type="radio" name="type" value="A1" onClick= "confirmation();" />A1
<input id="a2" type="radio" name="type" value="A2" onClick="confirmation();" />A2
<input id="a3" type="radio" name="type" value="A3" onClick="confirmation();"/>A3
使用Javascript
function confirmation() {
if (document.getElementById('a1').checked ) {
ty = document.getElementById('a1').value
var ask= confirm("You have chosen " + ty + " as your type \n If you have chosen the right type, Click Ok! " )
}
if (document.getElementById('a2').checked) {
level = document.getElementById('a2').value;
var ask= confirm("You have chosen " + ty + " as your Examination Level \n If you have chosen the right type, Click Ok! " )
}
if (document.getElementById('a3').checked) {
ty = document.getElementById('r1').value;
var ask= confirm("You have chosen " + ty + " as your type \n If you have chosen the right type, Click Ok! " )
}
if (ask==true) {
alert("You clicked ok");
}
if (ask==false) {
alert("You clicked cancel");
}
}
功能可以更简单。 您不必检查所有按钮,因为您可以将当前按钮传递给函数,如onclick="confirmation(this)"
。 要取消选中单选按钮,您可以将checked
属性设置为false
。
function confirmation(radio) { var ask = confirm("You have chosen " + radio.value + " as your type \\n If you have chosen the right type, Click Ok! ") if (ask) { alert("You clicked ok"); } else { alert("You clicked cancel"); radio.checked = false; } }
<input id="a1" type="radio" name="type" value="A1" onclick="confirmation(this)" />A1 <input id="a2" type="radio" name="type" value="A2" onclick="confirmation(this)" />A2 <input id="a3" type="radio" name="type" value="A3" onclick="confirmation(this)" />A3
我想你可以总结一下:
function confirmation(obj) { obj.checked ? confirm("You have chosen " + obj.value + " as your type \\n If you have chosen the right type, Click Ok!") ? alert("You clicked ok") : obj.checked = false : ""; }
<input id="a1" type="radio" name="type" value="A1" onClick="confirmation(this);" />A1 <input id="a2" type="radio" name="type" value="A2" onClick="confirmation(this);" />A2 <input id="a3" type="radio" name="type" value="A3" onClick="confirmation(this);" />A3
this
传递给函数。 this
指的是DOM对象。
取消选择时,您需要循环显示单选按钮以清除它们。 您的代码中也有一些小的语法错误,这些错误在下面进行了更正:
var ty;
function confirmation() {
if (document.getElementById('a1').checked) {
ty = document.getElementById('a1').value
var ask = confirm("You have chosen " + ty + " as your type \n If you have chosen the right type, Click Ok! ")
}
if (document.getElementById('a2').checked) {
ty = document.getElementById('a2').value;
var ask = confirm("You have chosen " + ty + " as your Examination Level \n If you have chosen the right type, Click Ok! ")
}
if (document.getElementById('a3').checked) {
ty = document.getElementById('a3').value;
var ask = confirm("You have chosen " + ty + " as your type \n If you have chosen the right type, Click Ok! ")
}
if (ask == true) {
alert("You clicked ok");
}
if (ask == false) {
var elem = document.getElementsByName('type');
for(var i=0;i<elem.length;i++) elem[i].checked = false;
alert("You clicked cancel");
}
}
你可以像这样使用 -
<input type="radio" value="1" onclick="return confirmation()" name="collections"> <input type="radio" value="2" onclick="return confirmation()" name="collections"> <input type="radio" value="3" onclick="return confirmation()" name="collections"> <script> function confirmation(){ if(confirm("Are you sure!")) { //do your job } else { return false; } } </script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.