Странная проблема IE8 с выбором, который запускает AJAX

Question

У меня странная ошибка с IE8 и поиском по почтовому индексу. Это может быть не поиск по почтовому индексу как таковой, который его вызывает - просто вызов AJAX, который изменяет выбор. Я настроил тестовую страницу здесь . Если щелкнуть «Найти адрес», а затем дважды щелкнуть (довольно быстро) по одному из адресов, который находится в пределах границы div с красной рамкой, вы увидите следующую ошибку в IE8.

Примечание. Я считаю, что воспроизвести ошибку некорректно, но если прокрутить список адресов до самого конца, а затем быстро щелкнуть дважды на Holly Cottage, это должно воспроизвести ошибку.

Если бы кто-нибудь мог пролить свет на это странное поведение, это было бы очень ценно. Это ошибка IE8?

Answer 1

Я обнаружил проблему - браузерам не нравится, когда для атрибута href установлено javascript:void().Если вы хотите иметь рабочий якорь, действие по умолчанию которого отменено, то используйте # для атрибута href, а затем установите обработчик события для этого якоря return false, чтобы отменить действие браузера по умолчанию.

---

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

Мне трудно найти проблему.Здесь я только рискну предположить: два эффекта, запускающиеся и заканчивающиеся одновременно, приводят в замешательство IE8, в результате чего div устанавливается на высоту 1px.Это, конечно, предполагает ошибку в реализации очереди эффектов в jQuery, за которую я точно не могу поручиться.На данный момент это всего лишь моя теория - мое незнакомство с панелью инструментов разработчика IE не позволяет мне продолжать исследования.

Answer 2

Я полагаю, проблема в том, что вы запускаете анимацию. Ваше асинхронное действие вызывает некоторые скользящие анимации.

Во-первых: Попробуйте записать окончания всех анимаций (поместите функцию обратного вызова в вызов slide* и зарегистрируйте некоторый текст на консоли.), Чтобы увидеть, работают ли они в правильном порядке - я полагаю, что они не работают, и в этом проблема.

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

Третье: Если вышеописанное не помогло, попробуйте это для каждой анимации:

if($(this).data('running')==0){
$(this).data('running',1).slideUp(function(){$(this).data('running',0)});
}else{ /*call with timeout or ignore...*/ }

Это базовый семафор элемента.

OR

Вы можете правильно использовать .animate и анимационные очереди в jQuery, но в этом случае это будет немного излишним (я думаю).

Answer 3

Моя первая реакция - это проблема CSS.Если я нахожу значение по умолчанию и нажимаю ссылку «Найти адрес» один раз, я вижу похожую (хотя и не идентичную) проблему с макетом.Высота каждой секции выглядит свернутой, как будто плавающие секции не подбирают правильную высоту содержимого.Если я постепенно указываю высоту для каждого contentRow или переключаю отображение с block-none-block на pcodeLookupAddressEdit_risk_address, форматирование исправляется.

Я не знаю конкретной причины, но вы можете проверитьCSS и поведение показа / скрытия на слайде.