使用 Javascript 验证单选按钮

Posted

技术标签:

【中文标题】使用 Javascript 验证单选按钮【英文标题】:Validation of radio buttons with Javascript 【发布时间】:2013-01-24 16:19:42 【问题描述】:

我在这里梳理了很多页面,但仍然无法让我的显式验证器工作。基本上,当单击提交按钮时,我希望脚本验证一个单选是否被选中,如果一个被选中则什么都不做。如果未选中,我希望它发布一条警报消息。

我的 html 大致如下:

<form id="myForm" onsubmit = "check()">
<input type = "radio" name = "c" id = "1" value = "1" />
<input type = "radio" name = "c" id = "2" value = "2" />
<input type = "radio" name = "c" id = "3" value = "3" />

<input type = "submit" value = "Submit" />

我的 JS 页面如下所示:

function check() 
    var r = document.getElementsByName("c")
    var c = 0

    for(var i=0; i < r.length; i++)
       if(c[i].checked) 
          c = i; 
    

    alert("please select radio");

【问题讨论】:

chennaisunday.com/jsradio.html 【参考方案1】:

信用卡 借记卡 通过现金

                </td>
            </tr>

我正在使用单选按钮列表 ..请分享此单选按钮是否有 java 脚本验证

【讨论】:

【参考方案2】:
             function ShowMsg()     

             if (fnSpeciality() == false) 
              
              document.getElementById("myform").focus();
               return false;
            

                function fnSpeciality() 
                
             return fnRblfnSpeciality();
                 
              function fnSpeciality() 
                   return fnRblfnSpeciality();
                          


    function fnRblfnSpeciality() 

        var list = document.getElementById('myform'); //Client ID of the radiolist
        var inputs = list.getElementsByTagName("input");
        var isItemChecked = false;
        for (var i = 0; i < inputs.length; i++) 
            var listItem = inputs[i];

            if (listItem.checked) 
                //alert(listItem.value);
                isItemChecked = true;
                break;
            
        
     if (isItemChecked == false) 
            if (isItemChecked =="") 
                alert('Please select a speciality.');
                return false;
            
            // else return true;
        
        return true;
    

【讨论】:

【参考方案3】:
<html>
<head>
<script language="javascript">
function check()    

chosen = ""
len = document.myform.chk.length

for (i = 0; i <len; i++) 
if (document.myform.chk[i].checked) 
chosen = document.myform.chk[i].value



if (chosen == "") 
alert("No Option selected");
return false;

else 
alert("option selected");
return true;


</script>
</head>
<body>
<form name="myform" onsubmit = "return check();">
<input type = "radio" name = "chk" id = "1" value = "1" >
<input type = "radio" name = "chk" id = "2" value = "2" >
<input type = "radio" name = "chk" id = "3" value = "3" >

<input type="submit" value="submit">

</form>
</body>
</html>

检查这个验证希望它也可以帮助你。也检查一下jsfiddle

【讨论】:

【参考方案4】:

试试这个

function check() 
var r = document.getElementsByName("c")
var c = -1

for(var i=0; i < r.length; i++)
   if(r[i].checked) 
      c = i; 
   

if (c == -1) alert("please select radio");

【讨论】:

刚试过这个,还是没有提示。页面基本上只是刷新,就像脚本不起作用一样。 @KelvinNguyen 如果您不想提交到服务器,则需要返回 false。【参考方案5】:

这个

c[i].check

应该是

c[i].checked

你实际上并没有对结果做任何事情,你只是一直在提醒。

【讨论】:

我更改了“已检查”。我还没有对结果做任何事情,即使没有检查任何内容,我什至无法让它发出警报。 你检查过控制台是否有错误?调试?等等,

以上是关于使用 Javascript 验证单选按钮的主要内容,如果未能解决你的问题,请参考以下文章

使用 Javascript 验证单选按钮

Javascript单选按钮组验证

验证后如何使用 JavaScript 和 HTML5 将图像放在单选按钮上

通过 JavaScript 验证单选按钮

验证单个单选按钮在可用的 javascript 验证脚本中不起作用

使用 servlet 验证服务器端的单选按钮