почему автофокус не работает на входной элемент

Question

Вот мой HTML:

<table id="tbl"> 
    <tr id="tx"><td><input type="text"/></td><td><input type="text" class="last" /></td></tr> 
</table> 

Вот мой JQuery:

$("#tbl").on("blur", ".last:last", function(){ 
    $("#tbl").append('<tr><td><input type="text" autofocus/></td><td><input type="text" class="last" /></td></tr>'); 
}); 

Как вы можете видеть в указанном выше коде, я пытаюсь добавить строка в таблицу, когда последняя ячейка последней строки теряет фокус. Вышеприведенный код работает отлично, но теперь я хочу сфокусировать первую ячейку вновь добавленной строки, когда она будет создана. Итак, я хотел бы спросить, почему html5 autofocus не работает в моем случае?

Вот ссылка на мой jsfiddle

Answer 1

Я изменил ваш скрипт это работает отлично.

<script> 
$("#tbl").on("blur", ".last:last", function(){ 
    $("#tbl").append('<tr><td><input type="text" class="focus_this" autofocus /></td><td><input type="text" class="last" /></td></tr>'); 
    $(".focus_this").focus(); 
    $('.focus_this').removeClass('focus_this'); 
}); 
</script> 

Answer 2

Дополнение к @LoneRanger ответ, который я хотел бы добавить, почему autofocus не работает.

autofocus автоматически получать фокус, когда page loads. В вашем случае страница не загружается, а изменяется только DOM. Прочтите это http://www.html5tutorial.info/html5-autofocus.php