1

チェックボックスのチェックを外してラジオボタンをクリアしようとしていました。私はそれのサンプルを手に入れることができます。しかし、同じセットが私のフォームに複数回あります。セット全体で使用できる汎用メソッドが必要です。

いくつか私を助けることができます。これが私のコードです。これにはJavaスクリプトを使用したいと思います。

<html>
<head>
<script language="JavaScript">

function loopForm(form) {
    var cbResults = 'Checkboxes: ';
    var radioResults = 'Radio buttons: ';
    for (var i = 0; i < form.elements.length; i++ ) {
        if (form.elements[i].type == 'checkbox') {
            if (form.elements[i].checked == true) {
                cbResults += form.elements[i].value + ' ';
            }
        }
        if (form.elements[i].type == 'radio') {
            if (form.elements[i].checked == true) {
                radioResults += form.elements[i].value + ' ';
            }
        }
    }
    document.getElementById("cbResults").innerHTML = cbResults;
    document.getElementById("radioResults").innerHTML = radioResults;
}

function loopForm123(form) {

    for (var i = 0; i < form.elements.length; i++ ) {

        if (form.elements[i].type == 'checkbox') {
            if (form.elements[i].checked == true) {
                alert('insde for loop1');
                form.elements[i].checked == false;
                alert('insde for loop3');
            }
        }
        if (form.elements[i].type == 'radio') {
            if (form.elements[i].checked == true) {
                alert('insde for loop2');
                form.elements[i].checked == false;
                alert('insde for loop4');
            }
        }
    }

}

</script>
<body>
<form name="thisForm">
I like to program in:<p>
<input type="checkbox" value="PHP" >PHP<p>
<input type="checkbox" value="Perl">Perl<p>
<input type="checkbox" value="Ruby">Ruby<p>
<input type="checkbox" value="ASP">ASP<p>
<hr>
I like to eat:<p>
<input type="radio" value="Snickers" name="candy" >Snickers<p>
<input type="radio" value="Hershey's" name="candy">Hershey's<p>
<input type="radio" value="M&M's" name="candy">M&M's<p>
<input type="radio" value="Nerds" name="candy">Nerds<p>
<hr>
I like to drink:<p>
<input type="radio" value="Coke" name="drink" >Coke<p>
<input type="radio" value="Gatorade" name="drink">Gatorade<p>
<input type="radio" value="Pepsi" name="drink">Pepsi<p>
<input type="radio" value="Milk" name="drink">Milk<p>
<br>
<input type="checkbox" value="Submit" onclick="loopForm123(document.thisForm);"> 
</form>
<p>
<div id="cbResults"></div>
<div id="radioResults"></div>
</body>
</html>

JSFiddle: http://jsfiddle.net/zzrVN/

4

2 に答える 2

0

このコードは、すべてのラジオ ボタンのチェックを外します

<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script>

$("input[type=radio]").prop("checked", false);

このコードは jquery であるため、このコードを実行するには jquery ライブラリを含める必要があります。

于 2013-08-23T09:05:49.540 に答える
0

リセット ボタンを使用してフォームをクリアできないのはなぜですか?

<input type="reset" value="Reset Form" />

しかし、あなたの質問に答えるために、jQuery を使用できる場合は、これを非常に簡単に行うことができます。

jQuery メソッド: http://jsfiddle.net/zzrVN/2/

$(document).ready( function() {
    $('#clearCheckboxes').click( function() {
        $('[name="thisForm"] input:checkbox').removeAttr('checked');
        $('[name="thisForm"] input:radio').removeAttr('checked');
    });
});

jQuery を使用するには、ドキュメントにスクリプト タグを 1 つ追加するだけです。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

ただし、jQuery を使用したくない場合、純粋な JavaScript ソリューションは次のようになります。

var inputItems = document.getElementsByTagName('input');
for (var i=0;i<inputItems.length;i++) {
        inputItems[i].checked = false;
}

編集：：：

チェックボックスに固有のこのコードを追加しました。

function resetRadioButtonValuesforCheckbox(checkbox) {
        var inputItems = document.getElementsByTagName('input');
        if(! checkbox.checked){
        for (var i=0;i<inputItems.length;i++) {
                inputItems[i].checked = false;
        }
        }
于 2013-08-23T09:03:29.190 に答える