4

それぞれに 3 つのラジオ オプションがある 3 つの質問を含むフォームがあります。質問のいずれかが空白のままになっている場合、フォームからアラートを送信するようにします。このコードは、すべての質問が空白のままになっている場合にのみアラートを送信します。

if (!$("input").is(':checked')) {
    alert("You left one blank!");
}

したがって、たとえば、1 つの質問にしか回答がない場合は、アラートを送信する必要があります。代わりに、コードを続行します。

4

4 に答える 4

3

3 つのラジオ グループがあるため、3 つのチェックされた入力と 6 つのチェックされていない入力があることをお勧めします。

if ( $("input[type=radio]:checked").length < 3 ) {
    alert('Please answer all of the questions');
}
于 2013-03-28T19:15:50.467 に答える
3

これを試して：

$(document).ready(function () {
    $("#btn1").on("click", function () {
        var count = 0;
        var questions = $("div.question");
        questions.each(function () {
            if ($(this).find("input").filter('[type="radio"]').filter(":checked").length > 0) {
                count++;
            }
        });
        if (count >= questions.length) {
            alert("all good");
        } else {
            alert("something not checked");
        }
    });
});

HTML の場合:

<div class="question">
    Question 1:
    <input type="radio" name="radio1" />
    <input type="radio" name="radio1" />
    <input type="radio" name="radio1" />
</div>

<div class="question">
    Question 2:
    <input type="radio" name="radio2" />
    <input type="radio" name="radio2" />
    <input type="radio" name="radio2" />
</div>

<div class="question">
    Question 3:
    <input type="radio" name="radio3" />
    <input type="radio" name="radio3" />
    <input type="radio" name="radio3" />
</div>

<div>
    <input type="button" id="btn1" value="Submit" />
</div>

http://jsfiddle.net/4yQHv/1/

すべての質問に対して正確に 1 つのラジオ ボタンが選択されていることを確認する代わりに、if (count >= questions.length) {beに変更できます。それ以外の場合、これにより複数のラジオ ボタンを選択できます (属性ごとにグループ化されている場合は、これは正確には不可能です)...しかし、それを指摘したかっただけです。===>=name

于 2013-03-28T19:17:36.723 に答える
0

http://jsfiddle.net/tVUuW/

<form>
    <input type="radio" name="facepunch" class="facepunch" value="1" />
    <input type="radio" name="facepunch" class="facepunch" value="2" />
    <input type="radio" name="facepunch" class="facepunch" value="3" />
    <br />
    <input type="radio" name="stack" class="stack" value="1" />
    <input type="radio" name="stack" class="stack" value="2" />
    <input type="radio" name="stack" class="stack" value="3" />
    <br />
    <input id="button" type="button">
</form>

$(document).ready(function(){
    $('#button').click(function(){
        if(!$("input.facepunch:checked").val()) {
            alert("Please select facepunch");
        }

        if(!$("input.stack:checked").val()) {
            alert("Please select stack");
        }
    });
});

この方法を使用できる無線のグループが少ない場合、これはユーザー データを検証する 1 つの方法です。

優れた jQuery Validation Plugins の 1 つをチェックすることをお勧めします: jzaefferer プラグイン、bassistance プラグイン

また、サーバー側でも必ず検証してください。ユーザーは別の場所からサーバーにリクエストを送信したり、ブラウザで JavaScript を無効にしたりすることもできます

于 2013-03-28T19:21:55.303 に答える
-1

すべてのラジオ ボタンをループして、それらのいずれかがオフになっているかどうかを確認できます。 

$('input[type="radio"]').each(function () {
       if( ! $(this).is(':checked') ) {
           alert('You left one blank!');
           return false; //exit function, so alert won't show multiple times
       }
    });

例

于 2013-03-28T19:14:44.413 に答える