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

Question

[sportik174]

Всем привет есть такой код:

$('.btn_1').click(function(){
  $('.btn_2').click(function(){
    console.log('нажата кнопка 2');
  });
});

Если нажать три раза на .btn_1, а затем на .btn_2 то сообщение 'нажата кнопка 2' выведется 3 раза
Как сделать так чтобы выводилось только 1 раз?

Код на codepen: https://codepen.io/khasenovweb/pen/eYMXyjY?editors=1111

Comments

[Степан Крапивин]

а зачем ты при каждом клике на первую кнопку навешиваешь обработчик клика на вторую?

Сколько первую кнопку нажмёшь, столько и будет обработчиков висеть на второй кнопке. Ну логично, что в консоль выводится столько сообщений, сколько кликнул на первую кнопку.

[sportik174]

Степан Крапивин, Я упростил для более легкого понимания

Answer 1

[StiflerProger]

Нажимая каждый раз на кнопку1, у тебя будет добавляться каждый раз новый обработчик события на кнопку2

$('.btn_1').click(function(){
  // этот код будет выполняться каждый раз когда ты будешь кликать по кнопке1
  $('.btn_2').click(function(){
    console.log('нажата кнопка 2');
  });
});

Чтобы работало как надо, подписывайся на события отдельно

$('.btn_1').click(function(){
  console.log('нажата кнопка 1');  
});

$('.btn_2').click(function(){
  console.log('нажата кнопка 2');
});

Answer 2

[Сергей Соколов]

Может, имеется в виду, что нажатие на Кнопку-1 открывает возможность для нажатий на Кнопку-2 ?

Тогда понадобится переменная, которую К-1 будет переводить в состояние «можно жать К-2»

Answer 3

[sportik174]

Решение такое:

$('.btn_1').click(function(){
  $('.btn_2').unbind();
  $('.btn_2').click(function(){
    console.log('нажата кнопка 2');
  });
});