jquery - 動的に作成されたテキスト ボックスに対して、blur イベントが発生しない

Question

最初の入力でぼかしイベントがアクティブになる理由はありますか。ただし、動的に生成されたテキストボックスの場合は起動しません。

<input type="text" class="year" />
<div id="t"></div>

<script>
$('.year').blur(function () {
    $('#t').html('<input type="text" id="y" />');
});

$('#y').on('blur', function () {
    alert('hello');
});
</script>

フィドルをチェック http://jsfiddle.net/kynsai/6pfST/

編集

次のコードを使用して入力を作成しています

<input type="text" id="rows" />
<div id="form"></div>



 $('#rows').on('blur', function () {
    msg = '<table"><tr><td>Year</td></tr>';
    for (i = 1; i <= $(this).val(); i++) {
        msg = msg + '<tr><td><input type="text" id="Year_' + i + '"></td></tr>';
    }
    msg = msg + '</table>';
    $('#form').html(msg);
});

では、なぜこの行が機能しないのでしょうか。

  $('input[id ^="Year_"]').on('blur', function () {
    alert('t');

});

前もって感謝します

Answer 1

.on() を使用します (.live() は新しい jQuery では非推奨です)。そして、ドキュメント準備機能でラップします。

$(document).ready(function() {
    $(document).on('focusout','.year', function() {
       $('#t').html('<input type="text" id="y" />');
    }).on('focusout', '#y', function() {
       alert('hello');
    });
});

Answer 2

#yイベントの外側ではおそらく動作しないため、ぼかしイベントを のぼかしイベント内に配置してみて.yearください。まだ html に配置されていないため、次のコードを試してください。

$('.year').on('blur',function () {
    $('#t').html('<input type="text" id="y" />');

    $('#y').on('blur', function () {
        alert('hello');
    });
});