Question

目前我想检查是否仅使用html和javascript检查了radiobox。当我单击单选按钮时，我想要弹出一条javascript警告消息，说明已单击此特定按钮，但没有任何内容出现。

有人能解决为什么我的代码有错误吗？

function checked()
{
if(document.getElementById("s1").checked)
{
  alert("Small");
}               
    if(document.getElementById("s2").checked)
    {
   alert("Medium");
}
if(document.getElementById("s3").checked)
{
   alert("Large");
}
if(document.getElementById("s4").checked)
{
   alert("Extra Large");
}
}

<input type="radio" id="s1" name="shirtsize" value="small" onchange="checked()"/>Small
<input type="radio" id="s2" name="shirtsize" value="medium" onchange="checked()"/>Medium
<input type="radio" id="s3" name="shirtsize" value="large" onchange="checked()"/>Large
<input type="radio" id="s4" name="shirtsize" value="extralarge" onchange="checked()"/>Extra Large

您的意见真的很感激

Answer 1

将您的函数名称从radio_checked()更改为checked()，因为已检查是保留关键字，并会导致错误！

Mark up到这里：

<input type="radio" id="s1" name="shirtsize" value="small" onchange="radio_checked()"/>Small

<强>脚本

function radio_checked()
{
    // ......... rest of code .........
}

Demo

您收到错误是因为checked是复选框和单选按钮的属性，而您正在创建具有相同名称的用户定义函数，即checked()，这将导致错误，您的休息代码将不会执行。

Answer 2

您必须进行以下更改 HTML

<input type="radio" id="s1" name="shirtsize" value="small" onClick="radioChecked()"/>Small

脚本

function radioChecked()
{
if(document.getElementById("s1").checked)
{
  alert("Small");
}               
    if(document.getElementById("s2").checked)
    {
   alert("Medium");
}
if(document.getElementById("s3").checked)
{
   alert("Large");
}
if(document.getElementById("s4").checked)
{
   alert("Extra Large");
}
}

Answer 3

试试这个，它会给你想要的东西

var rad = document.getElementsByTagName('input');
var value;
for (var i = 0; i < rad.length; i++) {
    if (rad[i].type === 'radio' && rad[i].checked) {

        alert("checked");     
    }
}

Answer 4

你可以尝试这个：

普通JS

<强>脚本

var show = function(v){
    alert(v + ' was clicked');
};

<强> HTML

<input type="radio" id="s1" name="shirtsize" value="small" onchange="show(this.value)"/>Small
<input type="radio" id="s2" name="shirtsize" value="medium" onchange="show(this.value)"/>Medium
<input type="radio" id="s3" name="shirtsize" value="large" onchange="show(this.value)"/>Large
<input type="radio" id="s4" name="shirtsize" value="extralarge" onchange="show(this.value)"/>Extra Large

JQuery的

<强>脚本

$(function(){
    $("#s1, #s2, #s3, #s4").on('change', function(e){
        e.stopPropagation();
        alert($(this).val() + ' was clicked');
    });
})

<强> HTML

<input type="radio" id="s1" name="shirtsize" value="small"/>Small
<input type="radio" id="s2" name="shirtsize" value="medium"/>Medium
<input type="radio" id="s3" name="shirtsize" value="large"/>Large
<input type="radio" id="s4" name="shirtsize" value="extralarge"/>Extra Large

确认是否检查了radiobox

4 个答案:

Demo