Передать переменную в функции JavaScript из цикла

Question

Необходимо передать переменную функции в цикле.При нажатии на кнопку идентификатор (или объект) должен попадать в функцию.

 $.each(data, function (index,subcatObj) {
                        if(subcatObj.didOrganizer==0){
                            y.innerHTML="<input type=\"button\" onclick=\"return makeDid(subcatObj);\" value=\"Назначить куратором1\">"
                        }
                        else {
                            y.innerHTML="<input type=\"button\" onclick=\"return deleteDid(subcatObj);\" value=\"Снять куратора\">"
                        }  


            function makeDid(item) {
                console.log(item)
            }
            function deleteDid(item) {
                console.log(item)
            }      
              })

Но возникает ошибка:

subcatObj не определен

Как это исправить?

Answer 1

Создайте элемент input явно (а не только в строке HTML), а затем используйте addEventListener для него (или присвойте его свойству onclick), чтобы захватить subcatObj в замыкании, такпеременную можно использовать в обработчике:

function makeDid(item) {
  console.log(item)
}
function deleteDid(item) {
  console.log(item)
}

$.each(data, function(index, subcatObj) {
  // next line not needed if y is empty already:
  y.innerHTML = '';
  const input = y.appendChild(document.createElement('input'));
  input.type = 'button';
  // best to use strict equality if possible:
  if (subcatObj.didOrganizer === 0) {
    input.value = 'Назначить куратором1';
    input.addEventListener('click', () => makeDid(subcatObj));
  } else {
    input.value = 'Снять куратора';
    input.addEventListener('click', () => deleteDid(subcatObj));
  }
});

(атрибуты onclick в HTML часто сложны в управлении и, как правило, в любом случае считаются довольно плохой практикой)