0

チェックボックスチェックイベントを追加イベント（ダイアログ表示など）に接続しようとしています。ただし、ブラウザーで html ファイルをテストしているときに、クリック イベントが機能していないようです。ただし、JSFiddle では機能しますが、これは非常に奇妙です。

http://jsfiddle.net/rEgAX/1/

私のHTML：

<label><input type="checkbox" name="checkbox-0" id="myCheckbox" /> Completed </label>

私のJavaScript：

var countChecked = function() {
    if ($("#myCheckbox").is(":checked"))
    {
        alert('checked!');
    }
};

$( "input[type=checkbox]" ).on( "click", countChecked );

私が書いたhtmlファイル：

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
        <script>
            // On clicking of the completed checkbox, we want to pop up a dialog for confirmation.
            var checkboxClicked = function() {
                if ($("#myCheckbox").is(":checked")) {
                    alert('checked!');
                        console.log('checked!')
                    }
                };

            $( "input[type=checkbox]" ).on( "click", checkboxClicked );

        </script>
    </head>
    <body>
        <label><input type="checkbox" name="checkbox-0" id="myCheckbox" /> Completed </label>
    </body>
</html>
4

2 に答える 2

3

コードを内部に配置する必要があります

$(document).ready(function(){
    ...
});

チェックボックスがレンダリングされる前にスクリプトが来るためです。

編集

私の最初の回答で問題が発生する可能性があります。オマールのコメントと参照に感謝します

.ready()関数ではなく、このようにする必要があります。

$(document).on('pageinit') { 
    ...
});
于 2013-08-15T02:08:17.613 に答える
0

デフォルトでは、jsFiddle はコードをロード ハンドラにラップします。

コードを次のようにラップしてみてください。

$(window).load(function(){
var countChecked = function() {
    if ($("#myCheckbox").is(":checked"))
    {
        alert('checked!');
    }
};

$( "input[type=checkbox]" ).on( "click", countChecked );
});
于 2013-08-15T02:07:12.863 に答える