javascript - jQuery HTML クリック イベントが 2 回発生する

Question

カスタム選択メニュー ボタンがあり、それを閉じるために html クリック イベントにバインドしました。しかし、イベントは 2 回発生しています。

http://jsfiddle.net/GnzBj/1/

$(function () {
    $('html').click(function () {
        console.log('html');
    });
});

2回の発砲を防ぐ理由/方法を知っている人はいますか?

Answer 1

イベントが 2 回トリガーされる理由は、UI 全体がlabel.

<div  ...>
    <label for="xmod-form-51183d51afa3d" ... >
        <select name="theme" id="xmod-form-51183d51afa3d" ...>
            ...
        </select>
        ...
    </label>
</div>

ラベルをクリックすると、関連するフォーム要素のクリック イベントもトリガーされます。

label要素を削除すると、期待どおりに動作します: http://jsfiddle.net/GnzBj/5/。

が必要な場合はlabel、できる限り少ない UI を含めますが、それでもクリックすると 2 つのイベントがトリガーされます。