e.preventDefault, не работающий в Firefox, переходит на верх страницы цели - PullRequest
1 голос
/ 29 марта 2012

У меня есть страница, на которой я пытаюсь создать общий стиль вкладок, с которыми будет работать эта функция, чтобы в основном скрыть все содержимое вкладок и показать ту, на которой щелкнули. Все это прекрасно работает, за исключением Firefox, где он все еще выполняет действие по умолчанию и переходит на страницу, когда вы нажимаете на цель. Как ни странно, если вы нажмете на тот, который уже открыт, он не прыгнет. В примере кода есть только 2 вкладки и наборы содержимого, но это может быть и просто.

<div id="recentGalleryBox">
  <ul class="tabs">
    <li class="active"><a href="#recentVideo" title="latest videos">Latest Videos</a></li>
    <li class="last"><a href="#recentPhoto" title="latest photos">Latest Photos</a></li>
  </ul>
  <div class="tabsContent bgNone">
    <div id="recentVideo">
      <img src="http://i.ytimg.com/vi/Ymjh5ZV1H48/0.jpg" class="articleImage vidThumb" />      
      <p class="readmore"><a href="/galleries/videos" title="View all photos">View all video galleries</a></p>
    </div>  
    <div id="recentPhoto">
      <img src="/images/sized/dev/images/uploads/gallery/genericphoto-280x175.jpg" width="280" height="175"  alt="Album Image" class="articleImage" />
      <p class="readmore"><a href="/galleries/photos" title="View all photos">View all photo galleries</a></p>
    </div>
  </div>
</div>

$(document).ready(function(){
  $('#recentPhoto').hide();
  $('.tabs li a').click(function(e){
    var reveal = $(this).attr("href");
    var theid = ""
    $(this).parents('ul').children('li').removeClass('active');
    $(this).parent().addClass('active');
    $(this).parents('ul').next().children().each(function(idx, item){
      theid = "#"+$(item).attr("id");
      if (reveal != theid) {$(theid).hide();}
    });
    $(reveal).fadeIn();
    e.preventDefault();
  });
});

1 Ответ

1 голос
/ 29 марта 2012

Не связано, но вы пропустили точку с запятой

var reveal = $(this).attr("href");
var theid = ""

- РЕДАКТИРОВАТЬ, спасибо @Interstellar_Coder за указание на это :)
без точки с запятой после theid, синтаксический анализатор достаточно умен, чтобы добавить пропущенные точки с запятой, но хорошо быть последовательным.

Проблема заключается в том, что вы вызываете if (reveal != theid) {$(theid).hide();}, поскольку содержимое в основном состоит только из этого, высота всего документа в одном экземпляре равна 0, поэтому вы ощущаете «скачок» наверх, вызванный щелчком.

Если у вас достаточно места ниже #recentGalleryBox, проблема исчезла

http://jsfiddle.net/B9M2k/14/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...