脚本会影响所有 div,我怎样才能让它只影响一个?

Script affects all divs, how can I get it to affect just one?

我在 NW.JS 中使用此函数来获取图像的文件位置。我在回调中使用该文件位置,使用 jquery 中的 .css() 修改 div 背景。我的问题是脚本似乎记得它修改的最后一个 div。当我尝试使用它来更改另一个 div 的背景之前已经使用它来更改不同 div 的背景时,两个 div 都更改了他们的背景。我想我需要能够让这个脚本知道哪个按钮点击了它并且忘记了另一个按钮要求它做的任何事情。如您所知,我是 javascript 的新手。我该怎么做?

function chooseFile(name, handleFile) {
    var chooser = document.querySelector(name);
    chooser.addEventListener("change", function(evt) {
    for(var f of this.files){
        console.log(f.name);
        console.log(f.path);
        handleFile(f.name, f.path);
    }
   }, false);
   chooser.click();  
}
chooseFile('#fileDialog', function(name, path){ ... /* do something with the file(s) */ });

在很多情况下,编写脚本使其能够对新文件作出反应是有意义的:

const chooser = document.getElementById('fileDialog');

// Treat chooser as a stream of new files that can be added at any time
chooser.addEventListener("change", function (evt) {
    for (const f of this.files) {
        console.log(f.name);
        console.log(f.path);
        handleFile(f.name, f.path);
    }
}, false);

// Then, when you want to prompt for a new file at any point in the future…
function promptForFiles() {
    chooser.click();
}

当这不可能时,您可以通过分配给旧的但可靠的 onchange 属性:

来让它一次最多容纳一个处理程序
function chooseFile(name, handleFile) {
    const chooser = document.querySelector(name);
    chooser.onchange = function () {
        for (const f of this.files) {
            console.log(f.name);
            console.log(f.path);
            handleFile(f.name, f.path);
        }
    };
    chooser.click();  
}