фокус в текстовом поле не выполняется после предупреждения в FF?

#javascript #jquery #asp.net

Вопрос:

Я выполняю проверку длины с помощью java script. Если длина ввода невелика, я показываю предупреждение, и после этого я хочу вернуть фокус в текстовое поле. Он работает в IE, но не работает в FF. Я много искал в Google, но ни одно решение не могло сработать, пожалуйста, помогите мне.

 function IsLengthOK(_title,_control,_length)
        {
               if(_control.value.length < _length)
                {   
                   alert("'"  _title  "'"   " must be minimum " _length "  characters in length");                                                                                            
                   document.getElementById('txtUserName').focus();

                   return(false);  
                }
        }

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

 if(IsLengthOK("Registration Username",this,6))
        {
       // do something next.            
        }

HTML моего текстового поля:

 <input id="txtUserName" type="text" tabindex="1" name="txtUserName" style="background: none repeat scroll 0% 0% white;">

Ответ №1:

 function IsLengthOK(_title,_control,_length) {
  if(_control.value.length < _length) {   
    alert("'"   _title   "'"   " must be minimum "   _length   " characters in length");
    setTimeout(function() {
      document.getElementById('txtUserName').focus();
    }, 0);
    return false;
  }
}

Это работает в моем Firefox. Он будет сфокусирован на объекте#txtUserName после setTimeout вызванного.

1. @Ronak, я пробовал это, но когда я нажал «ОК» в окне предупреждения, фокус переместился на изображение в верхней части баннера на странице. Есть ли что-то, что связано с порядком табуляции и т.д.?

2. У вас не будет доступа к ele в вашем setTimeout , потому что вы передали функцию в строке, которая будет eval() ‘d в другом контексте.

3. @Ronak Зачем вводить глобальный, когда вы могли бы просто создать там анонимную функцию?

4. @alex Зачем создавать анонимную функцию, когда вы можете использовать элемент с одной глобальной переменной?

5. @Ronak Потому что у вас есть хорошая инкапсулированная функция, которая имеет переменную, которая является излишне глобальной.

Ответ №2:

У меня это отлично работает в Firefox 4.

jsFiddle.

Вот предлагаемая переписать вашу функцию…

 function IsLengthOK(_title, _control, _length) {
    if (_control.value.length < _length) {
        alert("'"   _title   "'"   " must be minimum "   _length   "  characters in length");
        _control.focus();
        return false;
    }
    return true;
}

jsFiddle.

Вы передаете ссылку на свой элемент, но затем выбираете его снова. Для этого нет причин. Это только усложнит обслуживание. Это также привяжет эту функцию к вашему одному элементу, когда он мог бы быть более гибким.
Вы возвращаете false в круглых скобках. В этом нет необходимости. Кроме того, если условие истинно, оно возвращается false , поэтому логично предположить, что в противном случае оно должно возвращаться true (вместо undefined ).
Если у вас есть куча служебных функций проверки, подобных этой, может быть хорошей идеей использовать их как методы Validator объекта, например.
Почему вы добавляете в свои переменные префикс _ ? Вы должны удалить их.

Ответ №3:

Вместо того, чтобы использовать document.getElementById , как вы здесь:

 document.getElementById('txtUserName').focus();

Используйте селектор jquery, а затем извлеките необработанный элемент, вот так.

 $('#txtUserName')[0].focus();