Проблема с focusin/focusout при использовании jquery в IE7 и Firefox 3.x.x

В настоящее время я рву на себе волосы из-за очень странной проблемы.

У меня есть несколько полей ввода, в которые я поместил некоторый текст, используя некоторые элементы <span>.

На двух из них мой скрипт работает отлично, но на последнем он ведет себя немного странно.

Структура HTML для полей ввода идентична на 100%.

Я использую события focusin/focusout, чтобы показать или скрыть текст.

Код для достижения этого идентичен (и да, возможно, его можно было бы написать более эффективно, но я рассмотрю это на более позднем этапе).

Этот код работает нормально

// Defalut value i HVOR                
$("input#hvor").focusin(function(){
  $(this).parent().find(".spanHvorLabel").hide();
});
$("input#hvor").focusout(function(){
  if ($(this).val().length < 1){
    $(this).parent().find(".spanHvorLabel").show();
  }                 
});

// Defalut value i VEJ                
$("input#vej").focusin(function(){
  $(this).parent().find(".spanVejLabel").hide();
});
$("input#vej").focusout(function(){
  if ($(this).val().length < 1){
    $(this).parent().find(".spanVejLabel").show();
  }                 
});

И структура HTML для этого следующая

<div class="yui-ac left" id="AutoSuggestPlace">
  <label for="hvor"><span class="spanHvorLabel">By, postnr, kommune</span></label>
  <input type="text" autocomplete="off" class="yui-ac-input ac_input" id="hvor" name="hvor"/>
</div>

<div class="left" id="AutoSuggestRoad">
  <label for="vej"><span class="spanVejLabel">Vej</span></label>
  <input type="text" id="vej" class="yui-ac-input ac_input" name="vej" autocomplete="off" />
</div>

Как уже упоминалось, приведенный выше код отлично работает в кроссбраузерном режиме.

Однако следующий код не работает в Firefox и IE7, несмотря на то, что он идентичен.

$("input#fritekst").focusin(function(){
    $(this).parent().find(".sagsnummerLabel").hide();
});

$("input#fritekst").focusout(function(){
   if ($(this).val().length < 1){
     $(this).parent().find(".sagsnummerLabel").show();
   }                 
});

HTML выглядит так

<div id="fritekstholder">
  <label for="fritekst"><span class="sagsnummerLabel">F.eks. sagsnummer</span></label>
  <input type="text" name="fritekst" id="fritekst" />
</div>

Но по какой-то причине, когда текст щелкается в этом поле, он не скрывается. Но если щелкнуть в области поля ввода, где нет текста, он правильно отображается/скрывается.

Чтобы исправить это, я написал функцию щелчка, чтобы убедиться, что текст скрыт после щелчка.

Это выглядит так

// Defalut value i Fritekstsøgning
$(".sagsnummerLabel").click(function() {
  $(this).hide();
  $("input#fritekst").focus();
});

Этот обходной путь работает в Firefox и также скрывает текст в IE7... но как только поле ввода теряет фокус, текст по-прежнему отсутствует в IE7.

Вероятно, это что-то очень простое, чего мне не хватает, но я думаю, что слишком долго смотрел на это, поэтому надеюсь, что есть кто-то, кто может предоставить мне решение :-)


jquery firefox internet-explorer-7
person Community    schedule 30.06.2010    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Сначала проверьте, вы забыли поставить «>» в ​​закрывающий тег span в своем html.

person Mayur bhalgama    schedule 30.06.2010

arrow_upward
0
arrow_downward

Да. Это работает только тогда, когда текстовое поле пусто из-за этого условия. (if ($(this).val().length ‹ 1))

Например, если я установлю фокус, когда текстовое поле пусто, оно скроет метку. Затем я набрал что-то в текстовом поле, и фокус размылся, текстовое поле больше не будет отображаться, потому что длина его содержимого больше единицы.

Я правильно понимаю, что вы имеете в виду??

person Kai    schedule 30.06.2010
comment
Когда поле пусто и вы фокусируетесь на нем, текст справки должен исчезнуть. Если вы что-то пишете, то, конечно, он не должен появляться снова после потери фокуса, отсюда и тест на длину значения. Если он меньше единицы, текст справки должен быть показан снова. Как уже упоминалось, он отлично работает в двух из трех полей ввода. И я просто не понимаю, почему третий ведет себя по-другому... - person ; 30.06.2010