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

时间:2017-08-26 19:31:32

标签: javascript jquery node-webkit nwjs

我在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) */ });

1 个答案:

答案 0 :(得分:1)

在许多情况下,编写脚本以便它可以对新文件做出反应是有意义的:

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();  
}