как вызвать дочерний якорь, щелкнуть по родительскому клику div

У меня есть несколько экземпляров

<div class="picOuterDiv">
   <a href="examplepage.php?var=1" class="iframe" > page one </a>
</div>

<div class="picOuterDiv">
   <a href="examplepage.php?var=2" class="iframe" > page two </a>
</div>

Теперь я использую плагин jQuery colorbox для создания лайтбоксов. LightBox открывается, когда я нажимаю элемент привязки, элемент привязки с классом iframe. Он отлично работает до сих пор, используя

$(".iframe").colorbox({iframe:true, width:"646", height:"675"});

Я хочу открыть цветовую панель, когда я нажимаю на родительский элемент div. Я использовал следующий код для запуска href элемента привязки при нажатии div, но, по-видимому, одного href было недостаточно, элемент, на который нажали, должен иметь класс «iframe». Так что с этим кодом не работает.

$('.picOuterDiv').each(function(){
        $(this).on('click', function(){
            location.href = $(this).find('a').attr('href');
        });
});

Так может ли кто-нибудь помочь мне в том, как я могу сделать эту работу? Я надеюсь, что проблема ясна. Заранее спасибо.

ОБНОВЛЕНИЕ: http://jsfiddle.net/VhkFN/3/


javascript jquery colorbox
person jinni    schedule 26.11.2012    source источник
comment
ответ ниже или просто заполните якорем весь div с помощью CSS.   -  person Popnoodles    schedule 27.11.2012
comment
@popnoodles, ты видишь скрипт js? я отредактировал вопрос   -  person jinni    schedule 27.11.2012
comment
Смотрите ответ Кристофа, он единственный правильный, несмотря на +1. И он также упомянул var arr[], который, как я вижу, все еще был в вашем коде. jsfiddle.net/VhkFN/4   -  person Popnoodles    schedule 27.11.2012

Ответы (2)


arrow_upward
5
arrow_downward 

$('.picOuterDiv').click(function() {
   window.location.href=$(this).find('a').attr('href');
});​

Есть пара проблем с вашей скрипкой. Первый "var arr[]" неверен. Во-вторых, у гиперссылки нет свойства onclick, поэтому запуск клика мало что даст. Вместо этого вам нужно получить его атрибут href.

Демонстрация: http://jsfiddle.net/VhkFN/4/

person Christophe    schedule 26.11.2012
comment
что, гиперссылка не имеет никакого поведения при нажатии? как вы думаете, что он делает? - person Popnoodles; 27.11.2012
comment
@popnoodles Я добавил ссылку в свой ответ и изменил поведение на свойство для ясности. Мы говорим здесь о JavaScript, а не о HTML. Попробуйте другие ответы, чтобы понять, что я имею в виду. - person Christophe; 27.11.2012
comment
хм.. дай подумать об этом. на самом деле я собираюсь попробовать ... Да, все, кроме вас, кажется, были неправы. На самом деле запуск щелчка по дочерним пузырям резервного копирования, который затем вызывает щелчок... Превышен максимальный размер стека вызовов - person Popnoodles; 27.11.2012
comment
это был мой оригинальный метод @christophe. Но проблема с этим кодом в том, что он следует по ссылке. но не открывает всплывающее окно colorbox. Как я уже упоминал, я использую плагин jQuery colorbox. - person jinni; 27.11.2012
comment
@jinni хорошо, но ваш исходный код для получения href был неправильным. Я вижу, что вы исправили это в своем окончательном коде. - person Christophe; 27.11.2012
comment
предотвращение множественных кликов jQuery(".picOuterDiv").has('a').one('click', function (e) { window.location = $(this).find("a").first().attr("href"); }) - person Sukhjinder Singh; 10.02.2018

arrow_upward
0
arrow_downward

Это то, что сработало для меня. Как я уже сказал, я использовал jquery colorbox.

$(".picOuterDiv").click(function () {
   var anchorHref = $(this).find('a').attr('href');
   $(this).colorbox ({iframe:true, width:"646", height:"675", href: anchorHref});
});
person jinni    schedule 27.11.2012