Почему значение моей функции вызывается дважды?

Question

У меня есть функция, которая вызывается в другой функции. Он должен возвращать значения объекта json. Значения json меняются в зависимости от настроенных фильтров.

Почему оба значения вызываются, а не только последнее.

Мой код:

$.getJSON(json, api_result => {

      myFunc('#api_results', api_result);
});

function myFunc(id, json_data) {
  $(id).click(function() {
    console.log(json_data);
  });
}

Мой результат:

Я обновил свои фильтры, чтобы изменить параметры моего json, но при нажатии я получаю все свои изменения. Почему я не могу просто получить последние значения моего отфильтрованного json?

Answer 1

Каждый раз, когда вы получаете новый набор данных (из $.getJSON), вы вызываете myFunc и связываете другой обработчик с событием click в $(id). Вам необходимо удалить все существующие обработчики событий щелчка, прежде чем связывать новый:

function myFunc(id, json_data) {
  $(id).off('click').on('click', function() {
    console.log(json_data);
  });
}