web-dev-qa-db-ja.com

開発者ツールを使用して、ページ内のすべてのチェックボックスをオンにします

同じページに20個のcheck-boxesを作成するループがあります（異なるフォームを作成します）。 chrome開発者ツールを使用して、[〜＃〜] check [〜＃〜] allcheck-boxes同時に。

これは私が得た限りです：

function() {
    var aa= document.getElementsByTagName("input");
    for (var i =0; i < aa.length; i++){
     aa.elements[i].checked = checked;
    }
}

PS：Stack-Overflowで多くの質問を検索して見つけましたが、どれも役に立たなかったので、誰かが正しい答えを見つけてくれたら嬉しいです。

javascriptgoogle-chromecheckboxgoogle-chrome-devtools
30
Ignacio Correia
(function() {
    var aa= document.getElementsByTagName("input");
    for (var i =0; i < aa.length; i++){
        if (aa[i].type == 'checkbox')
            aa[i].checked = true;
    }
})()

最新のブラウザでは document.querySelectorAll を使用できます

(function() {
    var aa = document.querySelectorAll("input[type=checkbox]");
    for (var i = 0; i < aa.length; i++){
        aa[i].checked = true;
    }
})()
78
Musa

コンソール開発ツール（F12）から、javascriptまたはjQueryコードで使用するクエリセレクターを使用できます。

'$$'-すべてのアイテムを選択することを意味します。代わりに「$」を使用すると、最初のアイテムのみが取得されます。

したがって、すべてのチェックボックスを選択するには、次のようにします

$$('input').map(i => i.checked = true)

または

$$('input[type="checkbox"').map(i => i.checked = true)

7
Vlad Bezden

あなたはそれがほぼ正しいです。使うだけ

aa[i].checked = "checked";

ループ内。

つまり、次のことを確認する必要があります。

  1. "checked"は文字列であり、変数識別子ではありません。
  2. 存在しないaa.elementsではなく、aaに直接インデックスを作成します。
3
apsillers

クイックワンライナーをご利用の場合：

var aa = document.getElementsByTagName("input"); for (var i = 0; i < aa.length; i++) aa[i].checked = true;
2
user423430

これを試して ：）

(function () {
    var checkboxes = document.querySelectorAll('input[type=checkbox]');

    //convert nodelist to array
    checkboxes = Array.prototype.slice.call(checkboxes);
    checkboxes.forEach(function (checkbox) {
        console.log(checkbox);
        checkbox.setAttribute('checked', true);
    });

})()

http://jsfiddle.net/YxUHw/

1
Robin Drexler

すべてのチェックボックスを切り替える（チェック/チェック解除）Javascript関数。

function checkAll(bx)
{
 var cbs = document.getElementsByTagName('input');
 for(var i=0; i < cbs.length; i++)
 {
    if(cbs[i].type == 'checkbox')
    {
        cbs[i].checked = bx.checked;
     }
 }
}

開発者ツールからそれをしたい場合は、関数のパラメーターを削除し、値を 「本当」 または 「偽」 の代わりに 「bx.checked」

1
Prem Kumar Maurya

setAttribute を試してください。

(function() {
  var aa = document.getElementsByTagName("input");
  for (var i =0; i < aa.length; i++){
    aa.elements[i].setAttribute('checked', 'checked');
  }
})();

編集：関数をすぐに実行するために括弧を追加しました。

1
jimbo