0

チェックボックスにチェックが入っているかどうかをチェックする、現在取り組んでいるjavascriptがあります。この JavaScript コードは多かれ少なかれお粗末に書かれており、チェックボックスがオンになっているかどうかを確認するために、コード内の複数の場所で何度もチェックを行っています。パフォーマンスを向上させ、コードを DRY に保つために、一度だけチェックされるチェック ボックス オプションのマスター オーバーライドを設定する適切な方法があるかどうかを尋ねています。基本的に今、チェックが必要なすべての場所に行きます

if($("#element").attr("checked")){ 
    do something... 
} else {
    do something else...
}

私はJavaScriptに少し慣れていないので、これについてはベストプラクティスの質問としてもっと疑問に思っていました.

4

4 に答える 4

1

1 つの方法は、現在のページでチェックされているすべてのチェックボックスを取得し、それらを反復処理することです。

var checkedBoxes = document.querySelectorAll("input:checked");

for (var i =0; i<checkedBoxes.length; i++)
{
   //do something
}

これは、FF 3.1 以降、Safari 3.1 以降、IE8以降、および Chrome 4以降でのみ機能します。

また、querySelectoAll は(配列ではなく) NodeListを返すことにも注意してください。

于 2013-07-08T19:08:33.190 に答える
0

状態を自分で追跡して、jQuery の選択に費やす時間を削減できます...

このHTMLで

<div>
    <label for="box1">Box 1</label>
    <input type="checkbox" id="box1" name="BoxOne" />
    <span>Checked:</span>
    <span id='box1state'>?</span>
</div>

そしてこのJavaScript

$('document').ready(function () {

    var box1state = $('#box1state');

    $('#box1').change(function (e) {
        box1state.text(this.checked);
    });

    box1state.text($('#box1')[0].checked);
});

(フィドルhttp://jsfiddle.net/stephen61/uQv5y/1/を参照)

に<span>は常にチェックボックスの現在の状態が含まれます。代わりに、この手法を使用して、チェックボックスや関数内の状態をテストdo something...できdo something else...ます.change(...)。チェックボックスの状態が変化するたびに、それが変化したときにのみコードが起動され、必要なことを実行します。

于 2013-07-08T20:11:45.943 に答える