0

大規模なアプリケーションで追跡が難しいバグを、次の最小限の作業例に分離しました。

<html>
<head>
    <title>Test page</title>
    <script type="text/javascript" language="JavaScript">
        function OnClickHandler (t) {
            t.disabled = true;
            var n = parseInt (t.getAttribute ("num"));
            document.body.appendChild (document.createTextNode (
                "num = " + t.getAttribute ("num") + ", checked = " + t.checked.toString () + " | "
            ));
            t.setAttribute ("num", n + 1);
            t.disabled = false;
        }
    </script>
</head>
<body>
    <input type="checkbox" num="0" onclick="OnClickHandler(this)" />
    <br />
</body>
</html>

私が期待しているのは、num属性の値とチェックボックスのチェックされた状態が完全に同期することです。ただし、この条件は当てはまりません。チェックボックスをすばやくクリックすると表示されます。次に出力例を示します。

入力：2回の非常に速いクリック、短い一時停止、2回の非常に速いクリック、短い一時停止、シングルクリック

num = 0、checked = true | num = 1、checked = true | num = 2、checked = false | num = 3、checked = false | num = 4、checked = true |

ロジックの目的はnum、チェック状態が変化したときにのみ属性が変化することです。アプリケーションの後続のロジックの多くは、この同期に依存しています。この同期を実装するための推奨される方法は何ですか？

よろしくお願いします。

4

2 に答える 2

0

さて、質問を投稿した直後に問題を発見しました。私の間違いはかなり初歩的なものですが、とにかく回答を投稿すると思いました。

onchangeチェックボックスの代わりに正しい実装を使用する必要があるように見えonclickます。したがって、コードは次のようになります。

テストページ関数OnClickHandler（t）{t.disabled = true; var n = parseInt（t.getAttribute（ "num"））; document.body.appendChild（document.createTextNode（ "num =" + t.getAttribute（ "num"）+ "、checked =" + t.checked.toString（）+ "|"））; t.setAttribute（ "num"、n + 1）; t.disabled = false; }

これがいくつかの貧しい魂をいくつかの白髪を救うことを願っています。

于 2013-01-06T04:56:33.243 に答える
0

onclickではなくチェックボックスでonchangeを使用してみましたか？

于 2013-01-06T04:58:01.597 に答える