Как выполнить функцию один раз и избежать зацикливания?

Question

[Дмитрий]

<div class="wrap">
    <a class="button" href="">button</a>
</div>

задача в том, чтобы при нажатии на область блока .wrap передался клик на .button
но если делать это просто вот так

$('.wrap').on('click', function(){
    $(this).find('.button').click();
})

это приводит к зацикливанию

посоветовали вот это

$('.wrap')
.on('click', function() {
    $(this).find('.button').click();
  })
.on('click', '.button', function(e) {
    e.stopPropagation();
  })

но этот способ не подходит, так как по клику на .button необходимо чтобы вызвался lightbox, а в этом случае он не работает

Comments

[Мак Алексей]

А зачем передавать клик на кнопку когда можно вызвать функцию которую эта кнопка вызывает?

[Дмитрий]

Мак Алексей: дело даже не в том, что можно вызвать функцию на кнопке ( хотя я и не знаю как вызвать lightbox) а в том, как реализовать поставленную задачу

Answer 1

[Алексей Зуев]

$('.wrap').on('click', function(e){
  var button = $(this).find('.button');
  if (e.target !== button[0]) {
    button.click();
  }
});

Comments

[Дмитрий]

в консоли выбивает ошибку "e is not defined"

[Алексей Зуев]

Дмитрий: подправил

Answer 2

[Виталий Инчин ☢]

Всего 1 вопрос - зачем? -Зачем ставить лишний обработчик?

При клике на .wrap должен сработать обработчик на .button, как и при клике на сам .button. В таком случае достаточно установить клик только на .wrap:

$('.wrap').click(function() {
     $('#lightbox').show();
});

Answer 3

[Lumore]

codepen.io/anon/pen/gpJXvy

Comments

[Дмитрий]

не подходит, так как по .wrap я могу кликать НЕ один раз

[Lumore]

Дмитрий: а так?

[Дмитрий]

таже ошибка Maximum call stack size exceeded

Answer 4

[heartdevil]

Привет.

А вручную у вас lightbox вызывать нельзя?

То есть типа так сделать

$('.wrap')
.on('click', function() {
    $(this).find('.button').click();
  })
.on('click', '.button', function(e) {
    //Условно
   $('#lightbox').show();
    e.stopPropagation();
  })