Блог

Главная - Вопросы по программированию - Открыть iframe вместо post

Открыть iframe вместо post

#jquery #filter

#jquery #Фильтр

Вопрос:

У меня проблема с jQuery: когда я нажимаю на домашнюю страницу на изображении большого пальца, открывается iframe, но когда я нажимаю на элемент фильтра и на изображение большого пальца, открывается сообщение. Это тесты моего веб-сайта: [скрыто]

Почему, когда я нажимаю на фильтр, а затем на изображение, большой палец открывает post вместо iframe?

Спасибо и извините за мой плохой английский!

Комментарии:

1. Кажется, что при фильтрации элементов портфолио привязанное поведение теряется. В вашем JS есть строка, прокомментированная с помощью /* When a portfolio item is clicked */ . Есть ли там, где вы указываете элементам портфолио открывать тот «iframe», который вы говорите? Если это так, и я здесь просто предполагаю, попробуйте изменить этот вызов portfolioItemsEnabled.click( function (e) { на что-то вроде этого: $('#portfolio-items.enabled li').live("click", function(e) {

2. @scumah Я пытался, но это не работает! и затем с этим зависает зыбучий песок, и Firebug выдает мне эту ошибку: Uncaught TypeError: Property '$' of object [object DOMWindow] is not a function . В любом случае, большое вам спасибо!

3. @scumah произошла небольшая ошибка, я заменил $ на jQuery , и теперь это работает. Большое вам спасибо, мерзавцы!

4. Нет проблем, я опубликую это как более расширенный ответ, если вы не возражаете: P

Ответ №1:

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

Чтобы решить эту проблему, в jQuery есть событие .live(), которое привязывает обработчик события не только к текущим элементам DOM, но и к элементам, созданным в будущем (т. Е. созданным не при загрузке DOM, а позже).

В вашем коде .js у вас есть этот вызов:

 portfolioItemsEnabled.click( function (e) {
  if(!jQuery(this).hasClass('active') amp;amp; jQuery(this).hasClass('visible')) {    
    portfolioItems.removeClass('active');
    jQuery(this).addClass('active');
    portfolioItems.not('.active').find('.overlay').css({ display: 'none' });
    var postId = jQuery(this).attr('id').split('portfolio-')[1];
    tz_getPortfolio(postId);
  }
  e.preventDefault();
});

И для того, чтобы это работало в любое время, даже когда загружаются новые / разные элементы портфолио, вы должны изменить вызов следующим образом

 jQuery('#portfolio-items.enabled li').live("click", function(e) {
  if(!jQuery(this).hasClass('active') amp;amp; jQuery(this).hasClass('visible')) {    
    portfolioItems.removeClass('active');
    jQuery(this).addClass('active');
    portfolioItems.not('.active').find('.overlay').css({ display: 'none' });
    var postId = jQuery(this).attr('id').split('portfolio-')[1];
    tz_getPortfolio(postId);
  }
  e.preventDefault();
});