javascript - jQuery focus()иногда не работает в IE8




internet-explorer-8 (7)

Была похожая проблема с IE8. Я хотел сфокусировать ввод в диалоге, когда он открыт. Используется autoOpen = false. Заметил, что фокус не работает только для первого фокусируемого элемента в диалоге. Пробовал setTimeout но он работал только иногда. Размытие элемента перед фокусировкой мне помогло.

$('#dialog').find('#name').blur();
$('#dialog').find('#name').focus();

Я разрабатываю веб-приложение с использованием JQuery. У меня есть функциональность, которая добавляет новую строку из 3 полей ввода. После создания этих элементов DOM я хочу сфокусировать одно из полей ввода. Я делаю это с помощью вызова функции jQuery focus () в нужном поле ввода.

Проблема в том, что вызов focus () отлично работает в IE6 и FF3.5, но не работает в IE8.

Я пытался сделать простой рабочий пример этой проблемы, чтобы показать ее здесь, но с урезанной версией кода focus () работает нормально. Поэтому я предположил, что DOM еще не готов, когда я вызываю focus () в IE8. Для этого я попытался вызвать setTimeout ('myFocus ()', 400). У меня был успех, и в некоторых случаях фокус действительно работал, но все же не всегда. Случайно это не фокусирует мое поле ввода.

Вопрос: кто-нибудь сталкивался с подобными проблемами и кто-нибудь знает, как это обойти? Использование setTimeout выглядит как очень уродливый обходной путь.

Tnx заранее

Отредактировано: 26.08.2009

Удалось воспроизвести на простом примере. Вот код HTML + JS, который воспроизводит эту ошибку на IE8.

<html>
<head>
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
        function performChanged() {
          formChanged = true;
        }

        function handleChange() {
          var parentDiv = $('#container');
          newValue = $(html).html();

          parentDiv.html(newValue);
          $(".sel1",parentDiv).bind('change',handleChange);
          //alert('Uncomment this and after alert focus will be on input');
          $("input.cv_values",parentDiv).focus();
        }

        $(document).ready(function() {
          $('.trackChange').bind('change', handleChange);
        });
        var html = '<div class=\"div1\">\n<select class=\"sel1\" id=\"sel1\" name=\"sel1\"><option value=\"\"><\/option>\n<option value=\"11\">Select me to see problem<\/option>\n<\/select>\n\n\n<input class=\"cv_values\" id=\"sel3\" name=\"sel3\" size=\"30\" type=\"text\" value=\"\" /><br/>Focus should in input field. With alert it is but without alert focus is not there</div>';
    </script>
</head>
<body>
    <select class="trackChange" onchange='performChanged();'>
      <option value=""></option>
      <option value="1" >Select me to generate new inputs</option>
    </select>

    <div id="container"></div>
</body>

Для воспроизведения: 1) выберите значение из первого выпадающего списка. Вы увидите, что ввод в первый раз работает 2) выберите значение из второго раскрывающегося списка. Вы увидите, что ошибка воспроизводится.

Затем в коде вы можете закомментировать строку, где он показывает JS alert (). Странно то, что если есть этот alert (), то после него фокус работает нормально.

Надеюсь, это поможет понять, где моя проблема.

PS Мне нужно, чтобы мое приложение работало таким образом - оно восстанавливает эти входные данные после выбора значения из выпадающего списка. Это упрощенный пример моего приложения;).


Странно, у меня была такая же проблема, и я решил ее, используя простой старый javascript следующим образом:

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

Использование jQuery-эквивалента $('#friend_name').focus(); не работал в IE8: - /


В связи с решением Kazys я обнаружил, что это решает все мои проблемы (с использованием файлов IE8 и .HTA):

$("elem").blur();
$("elem").focus().focus();

Я понятия не имею, почему, но как-то вызов дважды фокусировки помогает IE в этом.

РЕДАКТИРОВАТЬ: я обнаружил, что вызовы .show () и .select () также могут помочь.


Поскольку вы не разместили ни одного кода, вы используете:

$(document).ready(function(){
    //code here
});

Это заставит JavaScript работать после загрузки HTML.

И вы должны также использовать живые события . Когда вы добавляете входные данные в dom, они автоматически будут привязаны к ним.

$("p").live("focus", function(){
   alert( $(this).text() );
});

Это означает, что каждый созданный p будет связан с фокусом.


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

Я не знаю, было ли когда-нибудь это исправлено, но сегодня я снова столкнулся с этой проблемой в IE11, используя jquery-2.1.3. Я обнаружил, что завершение вызова фокуса в setTimeout, как указано выше в Ponny, работает лучше всего для меня.

Мне действительно нужно было увеличить время ожидания в некоторых случаях, чтобы оно заработало.


Это лучшее решение на данный момент, чтобы установить фокус:

$ ('. elt'). fadeIn (200, function () {$ ('. elt'). focus ();});


Функции JavaScript могут получить доступ к следующим функциям:

  1. аргументы
  2. Локали (то есть их локальные переменные и локальные функции)
  3. Окружающая среда, которая включает:
    • глобальные, включая DOM
    • что-либо во внешних функциях

Если функция обращается к своей среде, то функция является закрытием.

Обратите внимание, что внешние функции не требуются, хотя они предлагают преимущества, которые я здесь не обсуждаю. Получая доступ к данным в своей среде, закрытие сохраняет эти данные. В подслучае внешних / внутренних функций внешняя функция может создавать локальные данные и, в конечном счете, выходить, и все же, если какая-либо внутренняя функция (ы) выживает после выхода внешней функции, тогда внутренняя функция (ы) сохраняет локальные данные внешней функции в живых.

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

Представьте, что события кнопки «Переполнение стека» и «Голос-вниз» реализованы как закрытие, voteUp_click и voteDown_click, которые имеют доступ к внешним переменным isVotedUp и isVotedDown, которые определены глобально. (Для простоты я имею в виду кнопки «Голос голоса» , а не массив кнопок «Ответить на голосование»).

Когда пользователь нажимает кнопку VoteUp, функция voteUp_click проверяет, является ли isVotedDown == true, чтобы определить, следует ли голосовать или просто отменить нисходящее голосование. Функция voteUp_click - это закрытие, потому что оно обращается к своей среде.

var isVotedUp = false;
var isVotedDown = false;

function voteUp_click() {
  if (isVotedUp)
    return;
  else if (isVotedDown)
    SetDownVote(false);
  else
    SetUpVote(true);
}

function voteDown_click() {
  if (isVotedDown)
    return;
  else if (isVotedUp)
    SetUpVote(false);
  else
    SetDownVote(true);
}

function SetUpVote(status) {
  isVotedUp = status;
  // Do some CSS stuff to Vote-Up button
}

function SetDownVote(status) {
  isVotedDown = status;
  // Do some CSS stuff to Vote-Down button
}

Все четыре из этих функций являются закрытием, поскольку все они получают доступ к своей среде.





javascript jquery internet-explorer-8