Question

我有2个单选按钮。我需要使用javascript为单选按钮提供验证。请告诉我我的代码有什么问题。这是代码。

$(function() {
    $("#XISubmit").click(function(){

        var XIGender= document.forms["XIForm"]["XIGender"].value;
        if (XIGender==null || XIGender=="") { 
             alert("Please select the gender"); 
             return false; 
        }
        document.getElementById("XIForm").submit();
    });

这是我的HTML代码：

<label>Gender </label> &nbsp&nbsp
<input type='radio' name='XIGender' value='Male' id="XImale"/>Male
<input type='radio' name='XIGender' value='Female' id="XIfemale"/>Female</td>

Answer 1

再来一次，

$(document).ready(function() {
    $("#XISubmit").click(function () {
        if($('input[name=XIGender]:checked').length<=0){
             alert("Please select the gender");
             return false;
         } 
        $( "#XIForm" ).submit();        
     });
});

JSFiddle

Answer 2

这是代码。您必须创建一个表单并在提交时进行验证。

HTML： -

 <form name="myForm" action="targetpage.asp" onsubmit="return validateForm();"   method="post">  
        <label>Gender</label>&nbsp&nbsp  
        <input type='radio' name='XIGender' value='Male' id="XImale" />Male  
        <input type='radio' name='XIGender' value='Female' id="XIfemale" />Female</td>  
        <input type="submit" value="submit" id="XISubmit" />  
    </form>

JS： -

 function validateForm() {  
        if (validateRadio(document.forms["myForm"]["XIGender"])) {  
            alert('All good!');  
            return false;  
        }  
        else {  
            alert('Please select a value.');  
            return false;  
        }  
    }  

    function validateRadio(radios) {  
        for (i = 0; i < radios.length; ++i) {  
            if (radios[i].checked) return true;  
        }  
        return false;  
    }

希望这会对你有所帮助。 :) 享受编码。

Answer 3

<form name="formreg" enctype="multipart/form-data" method="post">
    <input type="radio" value="male" name="gender" /> Male<br />
    <input type="radio" value="female" name="gender" /> Female<br />
    <input value="Submit" onclick="return inputval()" type="submit" />
</form>

<强> JS：

   <script type="text/javascript">
    function inputval() {
        var $XIForm = $('form[name=XIForm]');
        if ($("form[name='formreg'] input[type='radio']:checked").length != 1) {
            alert("Select at least male or female.");
            return false;
        }
        else {
            var gender = $("input").val();
            //alert(gender);
            $XIForm.submit();
            alert(gender);
        }
    }
</script>

Answer 4

使用:checked选择器，如下所示

function() {
  var len = $("input:checked").length;
  if(len == 0) {
    alert("Please select a gender");
    return false;
}

see fiddle

Answer 5

你无法获得那样的单选按钮的值。 document.forms["XIForm"]["XIGender"]将返回多个节点，您无法获得节点列表的value属性。自从使用jQuery以来，这可以变得更容易：

$("#XISubmit").click(function () {    
    var $XIForm = $('form[name=XIForm]');
    var XIGender = $XIForm.find('input[name=XIGender]:checked').val();
    if (XIGender == null || XIGender == "") {
        alert("Please select the gender");
        return false;
    }
    $XIForm.submit();
});

JSFiddle

使用javascript验证单选按钮

5 个答案: