Как настроить фокус на текстовое поле Html.TextBoxFor - mvc 2

Я пытаюсь настроить фокус на текстовое поле, которое создается следующим образом:

<%=Html.TextBoxFor(model => model.Email, new { style = "width:190px;Border:0px", maxsize = 190 })%>

Я попытался использовать javascript, который не очень помог:

   <script type="text/javascript">
       var txtBox = document.getElementById("Email");
       if (txtBox != null) txtBox.focus();
    </script>

Как настроить фокус на текстовое поле Html.TextBoxFor в mvc 2?

Ответы

Ответ 1

Где вы пишете этот javascript? Вы должны убедиться, что DOM загружен:

window.onload = function() {
    var txtBox = document.getElementById("Email"); 
    if (txtBox != null) { 
        txtBox.focus();
    }
};

Также HTML-помощники могут генерировать другой идентификатор в зависимости от контекста: например, если вы вызываете TextBoxFor внутри шаблона редактора.

Сказав это, это не решение, которое я бы рекомендовал вам. Чтобы решить все эти проблемы, я обычно применяю класс css к текстовому поле:

<%=Html.TextBoxFor(
    model => model.Email, 
    new { @class = "email", maxsize = "190" }) %>

где email класс определяется следующим образом:

.email {
    width: 190px;
    border: 0;
}

а затем используйте популярную структуру javascript, чтобы установить фокус, когда DOM готов:

$(function() {
    $('input.email').focus();
});

Ответ 2

вы можете использовать автофокус в HTML5. <%=Html.TextBoxFor(model => model.Email, new { style = "width:190px;Border:0px", maxsize = 190 ,autofocus = "autofocus" })%>