检查空的无线电输入

时间:2013-10-15 08:31:41

标签: javascript jquery radio-button

我想检查用户是否选择了一个单选按钮。我编码了这个:

HTML

<form action="myServlet" method="post">
        <input type="radio" id="rating-input-1-5" name="ratingInput1" value="5">
        <input type="radio" id="rating-input-1-4" name="ratingInput1" value="4">
        <input type="radio" id="rating-input-1-3" name="ratingInput1" value="4">        
        //etc
<button type="submit" class="myButton" onclick="sendSuccess()">Submit</button>
</form>

JS

   function sendSuccess(){

        var len = document.formRate.ratingInput1.length;
        var flag;

        for(i=0; i<len; i++){
            if (document.formRate.ratingInput[i].checked){
                flag = true;
            }
            else{
                flag = false;
                break;
            }   
        }

        if(flag === false){
            console.log('noooooo');
            return false;
        }else{
            console.log('yesssss');
        }
    }

但它不起作用。

5 个答案:

答案 0 :(得分:3)

您可以使用jQuery使用Attribute Equals Selector [name="value"]来查找具有相同名称的单选按钮和:checked以仅获取已选中的元素。您可以使用length检查是否收到任何选中的单选按钮。如果选中了length按钮,则radio将为零,如果选中一个或多个单选按钮,则{0}将大于零。

<强> Live Demo

if($('[name=ratingInput1]:checked').length)
     console.log('Yes');
else
     console.log('No');

答案 1 :(得分:2)

工作演示 http://jsfiddle.net/cXPYQ/

希望这符合您的需求:)代码

  $("form").submit(function () {
    var flag = true;
    $(':radio').each(function () {
        name = $(this).attr('name');
        if (flag && !$(':radio[name="' + name + '"]:checked').length) {
            alert(name + ' group not checked');
            flag = false;
        }
    });
    return flag;
});

答案 2 :(得分:1)

试试这个

<form name="formRate" action="myServlet" method="post">
    <input type="radio" id="rating-input-1-5" name="ratingInput1" value="5">
    <input type="radio" id="rating-input-1-4" name="ratingInput1" value="4">
    <input type="radio" id="rating-input-1-3" name="ratingInput1" value="4">        
    <button type="submit" class="myButton" onclick="return sendSuccess();">Submit</button>
</form>

function sendSuccess(){

var flag = false;

var len = $('input:radio[name="ratingInput1"]:checked').size();

    if(len == 0){
        console.log('noooooo');
        flag = false;
    }else{
        console.log('yesssss');
        flag = true;
    }
return flag;
}

答案 3 :(得分:0)

它是一个带有单选按钮的简单表单,所以你需要的只是给表单一个名称formRate,而不需要jQuery,以下内容将起作用

HTML

<form name="formRate" action="myServlet" method="post">
    <input type="radio" id="rating-input-1-5" name="ratingInput1" value="5">
    <input type="radio" id="rating-input-1-4" name="ratingInput1" value="4">
    <input type="radio" id="rating-input-1-3" name="ratingInput1" value="4">        
    <button type="submit" class="myButton" onclick="return sendSuccess();">Submit</button>
</form>

的Javascript

function sendSuccess() {
rating = document.forms["formname"]["ratingInput1"].value;
if(rating > 0){
    console.log(rating);
 }
 else {
    console.log('No rating');
 }
 return false;

}

答案 4 :(得分:0)

var flag = $('[name =“ratingInput1”]')。is(':checked');

如果没有选择具有该名称的电台,

将返回false。