Значения ввода HTML очищаются при обратной публикации

Question

Я создал два поля ввода и установил javascript для автофокуса в следующем блоке, когда достигну максимальной длины. Он работает правильно. Но при запуске любого события post back эти пустые поля становятся понятными. Я помещаю runat = "server" в поле ввода, затем значенияустранены четкие проблемы, но скрипт автофокуса не работает.Пожалуйста, помогите мне.

function movetoNext(current, nextFieldID) {
	if (current.value.length >= current.maxLength) {
		document.getElementById(nextFieldID).focus();
	}
} 

<input type="text" id="txtcard1" size="4" 
		onkeyup="movetoNext(this, 'txtcard2')" maxlength="4" />
		
<input type="text" id="txtcard2" size="4" 
		onkeyup="movetoNext(this, 'txtcard3')" maxlength="4"   /> 

Answer 1

В соответствии с вашими вопросами вопрос, кажется, вы используете ASP.net.

Вы должны добавить runat="server", чтобы сохранить состояние элемента управления, но в то же время, когда вы добавляете runat="server", элемент управления будет отображаться на уровнеи идентификатор элемента управления будет изменен.

Итак, вам нужно ClientIDMode="Static" тег при использовании элемента управления на стороне клиента.

Для Eg:

<input type="text" id="txtcard2" size="4" 
        onkeyup="movetoNext(this, 'txtcard3')" maxlength="4"  ClientIDMode="Static" runat="server"  /> 

Answer 2

Вы также можете использовать Control.ClientID , чтобы получить идентификатор элемента управления ASPX на стороне клиента.При этом элемент управления будет доступен как на стороне сервера, так и на стороне клиента.

<input type="text" id="txtcard1" size="4" runat="server"
        onkeyup="movetoNext(this, '<%= txtcard2.ClientID %>')" maxlength="4" />

<input type="text" id="txtcard2" size="4" runat="server"
        onkeyup="movetoNext(this, '<%= txtcard3.ClientID %>')" maxlength="4"   /> 

Также не уверен с вашим требованием, но если вы хотите перейти к элементам управления в вашей форме, используйте tabindex

Answer 3

Но если вы используете более старую версию, она не будет работать, поскольку атрибут автофокуса является новым для HTML5, который получил широкую поддержку только в недавнем выпуске brwser