すべてを選択しますか？私は間違って何をしていますか？

-1

私はこれを取得しようとしていますすべてのコードを選択するが、私は間違っているのか分からない。私はここにコードを見つけました http://jsfiddle.net/L6e72fpv/すべてを選択しますか？私は間違って何をしていますか？

私はそれが互換性の問題か、私は間違ったコードを一緒に入れているのか分かりません。 jsfiddleではうまく動作しますが、フルページでは動作しません。これは私がページに持っている方法です。

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html;" charset="utf-8" /> 
<title>TEST</title> 
<script> 
$("#checkAll").change(function() { 
    $("input:checkbox").prop('checked', $(this).prop("checked")); 
}); 
</script> 
</head> 
<body> 
<form action="#"> 
    <p> 
    <label> 
     <input type="checkbox" id="checkAll" /> Check all</label> 
    </p> 

    <fieldset> 
    <legend>Loads of checkboxes</legend> 
    <p> 
     <label> 
     <input type="checkbox" /> Option 1</label> 
    </p> 
    <p> 
     <label> 
     <input type="checkbox" /> Option 2</label> 
    </p> 
    <p> 
     <label> 
     <input type="checkbox" /> Option 3</label> 
    </p> 
    <p> 
     <label> 
     <input type="checkbox" /> Option 4</label> 
    </p> 
    </fieldset> 
</form> 
</body> 
</html> 
</body> 
</html>

出典

2017-04-21 Markw

スクリプトを一番下に置くと、チェックボックスが実際に作成される前にイベントを割り当てようとしています。一番上で動作させるには、document.ready関数に入れ、jqueryを組み込みます。 – CAllen

jQueryをフルページにインポートしましたか？あなたはあなたのフルページに 'checkAll'というIDの要素を持っていませんか？ – Lixus

jQueryライブラリは含まれていません。それをロードせずに、jQueryは動作しません。また、あなたの身体とhtmlタグを2回閉じました。

これを試してみてください：

<html> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html;" charset="utf-8" /> 
 
<title>TEST</title> 
 
</head> 
 
<body> 
 
<form action="#"> 
 
    <p> 
 
    <label> 
 
     <input type="checkbox" id="checkAll" /> Check all</label> 
 
    </p> 
 

 
    <fieldset> 
 
    <legend>Loads of checkboxes</legend> 
 
    <p> 
 
     <label> 
 
     <input type="checkbox" /> Option 1</label> 
 
    </p> 
 
    <p> 
 
     <label> 
 
     <input type="checkbox" /> Option 2</label> 
 
    </p> 
 
    <p> 
 
     <label> 
 
     <input type="checkbox" /> Option 3</label> 
 
    </p> 
 
    <p> 
 
     <label> 
 
     <input type="checkbox" /> Option 4</label> 
 
    </p> 
 
    </fieldset> 
 
</form> 
 
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
<script> 
 
$("#checkAll").change(function() { 
 
    $("input:checkbox").prop('checked', $(this).prop("checked")); 
 
}); 
 
</script> 
 
</body> 
 
</html>

は私がやったことは<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> jQueryのなどがあり、それをロードした後にスクリプトを追加しました。今はうまくいく！

出典

2017-04-21 17:09:11

ありがとうございます。私はまだJQueryを初めて使っています。余分な/ htmlと/ bodyはコードの削除から残されました。私はそれらを逃したことを気づかなかった。 – Markw

すべてを選択しますか？私は間違って何をしていますか？

答えて

関連する問題