OnClickイベントJavaScriptに自分自身を渡す

timtour97

javascriptの入力に追加したonclickイベントが適切に機能していません。
これまでの私のコードは次のようになります。

function order(option) {
    if(option.checked) {
        document.getElementId("col_order").value = document.getElementById("col_order").value + " " + option.value;
    }
}
...//somewhere further down
for(var i = 0; i < options.length; i++) {
    var check = document.createElement("input");
    var label = document.createElement("label");
    var description = document.createTextNode(options[i]);
    check.type = "checkbox";
    check.name = "order_list[]";
    check.value = options[i];
    check.onclick = "order(check)";  //Problem here
    label.appendChild(check);
    label.appendChild(description);
    element.appendChild(label);
}

私も試しました:

check.onclick = (function() { var option = check; return function() {order(option);}})();

私が抱えている問題は、check.onlickのコード行です。これを通常のHTMLで追加すると、次のようになります。

<input type = "checkbox" name = "order_list[]" onclick = "order(this)" value = "randVal">randVal</input>

何の問題もありません。メソッドは意図した結果で実行されます。何かご意見は?
はっきりさせておきますが、order関数には問題なく到達しましたが、チェックボックスがクリックされただけなのに、ifステートメントに入ることがありません。

アデネット

addEventListener代わりに使用してください。動作するように見えても、forループにクロージャーがないため、各反復で同じ変数を上書きしているため、問題を回避するためにクロージャーを追加する可能性があります。

チェックボックスの場合、changeイベントをリッスンしますがclick

for(var j = 0; j < options.length; j++) {
    (function(i) {

        var check = document.createElement("input");
        var label = document.createElement("label");
        var description = document.createTextNode(options[i]);

        check.type = "checkbox";
        check.name = "order_list[]";
        check.value = options[i];

        check.addEventListener('change', function() {
            if (this.checked) {
                var col_order = document.getElementById("col_order");
                col_order.value = col_order.value + " " + this.value;
            }
        }, false);

        label.appendChild(check);
        label.appendChild(description);
        element.appendChild(label);

    })(j);
}

フィドル

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

'this'をonclickイベントに渡す

分類Dev

socket.io-clientのクライアントで自分自身にイベントを発行する

分類Dev

Javascript-関数に同じパラメータを渡すonClickイベント

分類Dev

JavaScript onClickイベントでパラメーターを渡す

分類Dev

Qtのemit()で自分自身へのポインタを渡す

分類Dev

onclickイベントにパラメータを渡す

分類Dev

onclickイベントを介してjsonでエンコードされた多次元配列をjavascriptに渡す

分類Dev

イベントデリゲートを使用するには、デリゲートを自分自身に設定する必要がありますか?

分類Dev

自分自身を繰り返さずにPowerShellコマンドレットに特定の引数を渡す方法は?

分類Dev

クライアントがイベントに接続したときにクライアントイベントハンドラー/リスナーを呼び出します(イベントに自分自身を追加します)

分類Dev

パラメータとして自分自身を渡す Javascript オブジェクト

分類Dev

自分自身を呼び出すスクリプトに変数を渡す

分類Dev

自分自身を指すポインタ

分類Dev

「onclick」イベントをトリガーする要素のIDをイベント処理関数に渡す方法

分類Dev

jQueryスライダーの値をonclickイベントに渡す方法は?

分類Dev

Google Maps geoXML3:それ自身のイベントリスナーに目印を渡しますか?

分類Dev

ボタンの値をonclickイベント関数に渡す方法は?

分類Dev

onClickイベントをJavaScript forループに追加する

分類Dev

Javascript変数にonClickイベントを追加する方法

分類Dev

自分自身を自分自身の別のインスタンスに割り当てる方法

分類Dev

onClickイベントで関数にパラメーターを渡す方法

分類Dev

javascriptでonmouseenterイベントにonfocusを渡します

分類Dev

onClickイベントを逆にする

分類Dev

init関数で自分自身に依存するオブジェクトをインスタンス化する方法は?

分類Dev

javascriptを使用してonclickイベントを動的にバインドする

分類Dev

イベントを親に渡す

分類Dev

AjaxStartイベントに値を渡す

分類Dev

onclickイベントで変数を渡す

分類Dev

Onclickイベントでパラメータを渡す

Related 関連記事

  1. 1

    'this'をonclickイベントに渡す

  2. 2

    socket.io-clientのクライアントで自分自身にイベントを発行する

  3. 3

    Javascript-関数に同じパラメータを渡すonClickイベント

  4. 4

    JavaScript onClickイベントでパラメーターを渡す

  5. 5

    Qtのemit()で自分自身へのポインタを渡す

  6. 6

    onclickイベントにパラメータを渡す

  7. 7

    onclickイベントを介してjsonでエンコードされた多次元配列をjavascriptに渡す

  8. 8

    イベントデリゲートを使用するには、デリゲートを自分自身に設定する必要がありますか?

  9. 9

    自分自身を繰り返さずにPowerShellコマンドレットに特定の引数を渡す方法は?

  10. 10

    クライアントがイベントに接続したときにクライアントイベントハンドラー/リスナーを呼び出します(イベントに自分自身を追加します)

  11. 11

    パラメータとして自分自身を渡す Javascript オブジェクト

  12. 12

    自分自身を呼び出すスクリプトに変数を渡す

  13. 13

    自分自身を指すポインタ

  14. 14

    「onclick」イベントをトリガーする要素のIDをイベント処理関数に渡す方法

  15. 15

    jQueryスライダーの値をonclickイベントに渡す方法は?

  16. 16

    Google Maps geoXML3:それ自身のイベントリスナーに目印を渡しますか?

  17. 17

    ボタンの値をonclickイベント関数に渡す方法は?

  18. 18

    onClickイベントをJavaScript forループに追加する

  19. 19

    Javascript変数にonClickイベントを追加する方法

  20. 20

    自分自身を自分自身の別のインスタンスに割り当てる方法

  21. 21

    onClickイベントで関数にパラメーターを渡す方法

  22. 22

    javascriptでonmouseenterイベントにonfocusを渡します

  23. 23

    onClickイベントを逆にする

  24. 24

    init関数で自分自身に依存するオブジェクトをインスタンス化する方法は?

  25. 25

    javascriptを使用してonclickイベントを動的にバインドする

  26. 26

    イベントを親に渡す

  27. 27

    AjaxStartイベントに値を渡す

  28. 28

    onclickイベントで変数を渡す

  29. 29

    Onclickイベントでパラメータを渡す

ホットタグ

アーカイブ