48212


入力要素の `input` イベントハンドラをあらかじめ設定している状態で、動的にテキスト要素を追加すると、value
に全角文字が含まれている場合、IE11 で `input` イベントが発火してしまいます。他のブラウザや、テキストに全角文字が含まれていない場合には
`input` イベントは発生しません。

「要素の追加後に `input` イベントハンドラを後から追加する」という方法以外で何か対処方法はあるでしょうか？

以下、再現コードです。

[code]

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
    </head>
    <body>
        <button type="button">追加</button>
        <script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
        <script>
            $("body").on("input", "input", function () {
                console.log("input");
            });
            $("button").on("click", function () {
                var $input = $('<input type="text" value="あ" />');
                $("body").append($input);
                console.log("append");
            });
        </script>
    </body>
    </html>
    
[/code]


CC BY-SA 4.0
2018-08-26T07:15:32.193
47817
2018-09-08T10:49:16.683
3925
question
javascript html jquery html5 internet-explorer
IE11 全角文字を設定した input 要素を追加すると input イベントが発生するのを抑止したい


私の手元でも再現し、以下のように値を別に設定するように変更することでおさまりました。

[code]

    var $input = $('<input type="text">');
    $input.val("あ");
    
[/code]

これでいかがでしょうか?  
(回避方法を見つけただけで、理由は知りません)


CC BY-SA 4.0
2018-08-26T16:00:37.230
47827
2018-08-26T16:00:37.230
5288
47817
answer


自己回答になりますが、以下のように `clone()` を併用することで回避できました。

[code]

    $("body").append($input.clone());
    
[/code]


CC BY-SA 4.0
2018-09-08T10:49:16.683
48212
2018-09-08T10:49:16.683
3925
47817
answer