0

クリックされたアイテムがチェックボックスであるかどうかを知るために、私は以下を使用していました。

if ($(e.target).className === 'checkbox') {}

jQuery の最新バージョンにアップグレードすると、Chrome、Safari、および Firefox で undefined が返されるようになりました。

チェックボックスでクリックが発生したかどうかを判断する最良の方法は何ですか?

ありがとう

4

5 に答える 5

3

私はあなたが物事を混同していると思います。

className要素の属性であり、jQuery オブジェクトではありません。したがって、本当に jQuery なしでクラスを取得したい場合は、次を使用します。

e.target.className == "checkbox"

しかし、それに関する問題は、classNameスペースで区切られた複数のクラスである可能性があるため、正規表現などを使用して実際に見つける必要があることです。

あなたがjQueryでそれをしたいなら、私は使用します：

$(e.target).hasClass("checkbox")

本当にチェックボックス要素を探している場合は、次のいずれかを使用できます。

e.target.tagName.toLowerCase() == "input" && e.target.type.toLowerCase() == "checkbox"
$(e.target).is("input:checkbox")  // jQuery docs for :checkbox selector suggest including "input"
$(e.target).is('[type="checkbox"]')  // jQuery docs also suggest to use this instead of the above because it's faster than :checkbox in modern browsers

http://api.jquery.com/checkbox-selector/

于 2012-10-04T18:35:15.233 に答える
3

.is関数と:checkboxセレクターを使ってみる

if ($(e.target).is(':checkbox')) {
   //it is a checkbox
}

デモ: http://jsfiddle.net/a5SbG/1/

または試すことができます

if (e.target.type == 'checkbox') { 
  //It is a checkbox
}

デモ: http://jsfiddle.net/a5SbG/

于 2012-10-04T18:32:25.147 に答える
1

ストレート JS では、通常は次のようにします。

var eTarget = e.target !== null ? e.target : e.srcElement;

if (eTarget.type === 'checkbox') { }
于 2012-10-04T18:34:46.980 に答える
0 
       $(document).ready(function () {
       $("input:checkbox").click(function () {
           if ($(this).is(":checked")) {
               //Do Stuff if Checked
           } 
       });
   });
于 2012-10-04T18:51:51.453 に答える
0

これは私にとってはうまくいくようです：

window.addEventListener('load', function () {

    function onClick() {
        if (this.tagName.toUpperCase() === 'INPUT' && this.type.toUpperCase() === 'CHECKBOX') {
            console.log([this.tagName, this.type])
        } else {
            console.log("HTML Element has Wrong tag or type");
        }
    };

    document.getElementById("myCheckBox").addEventListener('click', onClick);
    document.getElementById("myButton").addEventListener('click', onClick);
});

HTML:

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <label><input id="myCheckBox" type="checkbox" />Click Me!</label>
    <input type="button" id="myButton" value="Click Me!" />
    <script type="text/javascript" src="detectElementType.js"></script>
</body>
</html>

ここで動作を確認してください (Chrome で F12 を押してコンソールを表示するか、FireBug コンソールなどを開きます):

http://www.sanbarcomputing.com/flat/forumPosts/detectElementType/detectElementType.html

addEventListener() は、すべてのブラウザー (ECMAScript 5 の新機能) でサポートされているわけではありませんが、利点があります。ここでイベント ハンドラーに関する記事を参照してください。

http://www.javascripter.net/faq/addeventlistenerattachevent.htm

于 2012-10-04T18:56:11.243 に答える