如何使用EventListener内部的父函数中的参数

Question

基本上，当用户要添加打印机或编辑当前打印机时，此功能将打开模式。打印机布置在桌子上，上面有各种特征。

Open -Modal函数的行参数是事件从中触发的行。但是，当我尝试访问edit EventListener内部的这一行时，当该人选择编辑一行时，该行被触发时，它只能访问已编辑的第一行。

如何在EventListener中使用正确的行？

function openmodal(option, row) {
    backdropModal.style.display = "block";
    modal.style.display = "block";
    if (option === 'add-new') {
        edit.style.display = 'none';
    }
    edit.addEventListener('click', function (event) {
        var editedPrinter = new Printer(
            document.getElementById('post-brand-input').value,
            document.getElementById('post-type-input').value,
            document.getElementById('post-code-input').value,
            document.getElementById('post-color-input').value,
            document.getElementById('post-quantity-input').value,
            document.getElementById('post-updated-input').value,
            document.getElementById('post-name-input').value,
            document.getElementById('post-location-input').value,
            document.getElementById('post-notes-input').value,
            document.getElementById('post-min-quantity-warning').value
        );

        while (row.firstChild) {
            row.removeChild(row.firstChild);
        }
        addPrinter(row, editedPrinter);
        event.stopImmediatePropagation();
    });
    addNew.addEventListener('click', addNewPrinter);
}

Answer 1

您不应该在openmodal中添加事件侦听器。每次打开模态时，都会向元素添加一个新的听众，但是旧的听众仍在那里，所以他们都运行。

您应该只添加一次听众。openmodal()可以设置一个全局变量，该变量告诉侦听器选择了哪一行。

var selectedRow;
function openmodal(option, row) {
    backdropModal.style.display = "block";
    modal.style.display = "block";
    if (option === 'add-new') {
        edit.style.display = 'none';
    }
    selectedRow = row;
}
edit.addEventListener('click', function (event) {
    var editedPrinter = new Printer(
        document.getElementById('post-brand-input').value,
        document.getElementById('post-type-input').value,
        document.getElementById('post-code-input').value,
        document.getElementById('post-color-input').value,
        document.getElementById('post-quantity-input').value,
        document.getElementById('post-updated-input').value,
        document.getElementById('post-name-input').value,
        document.getElementById('post-location-input').value,
        document.getElementById('post-notes-input').value,
        document.getElementById('post-min-quantity-warning').value
    );
    while (selectedRow.firstChild) {
        selectedRow.removeChild(selectedRow.firstChild);
    }
    addPrinter(selectedRow, editedPrinter);
    event.stopImmediatePropagation();
});
addNew.addEventListener('click', addNewPrinter);

Answer 2

也许您想这样做：

addNew.addEventListener('click', function(evtObj){
  addNewPrinter.call(this, evtObj, argument1, argument2);
});