Javascript HTMLImageElement onclick

我试图添加一个onclick事件，该事件调用函数selectMain（name）。当我运行我的项目时，它似乎没有从图像生成onclick属性

function previewFiles() {

  var preview = document.querySelector('#preview');
  var files = document.querySelector('input[type=file]').files;

  function readAndPreview(file) {

    if (/\.(jpe?g|png)$/i.test(file.name)) {
      var reader = new FileReader();

      reader.addEventListener("load", function() {
        var image = new Image();
        image.height = 100;
        image.title = file.name;
        image.src = this.result;
        image.onclick = selectMain(file.name);
        preview.appendChild(image);
      }, false);
      reader.readAsDataURL(file);
    }
  }

  if (files) {
    [].forEach.call(files, readAndPreview);
  }
}

---

试试这个

image.onclick=function（）{selectMain（file.name）；}
在现有代码中，函数在dom上渲染时被调用

(/\.(jpeg?g|png)$/i.test(file.name))

下面是绑定事件的正确方法

   var image = new Image();
       image.height = 100;
       image.title = file.name;
       image.src = this.result;
       image.onclick =()=>{selectMain(file.name)};

除了Gagik回答的问题（早期的
selectMain
呼叫即使不能解决整个问题，也肯定是一个问题），还有什么问题

document.getElementById("primaryPhoto").value = file;

该怎么办？如果
primaryPhoto
是一个
input[type=file]
元素，那么由于安全限制，该元素将不起作用

不能从脚本设置文件选择器的值

.
代码中的问题是，您的编写方式如下
image.onclick=selectMain（file.name）
selectMain函数将在要将其附加到onclick事件的行中调用。您必须将onclick事件附加到函数定义或函数名，但现在用括号调用它。但是如果你想给函数参数，你必须创建一个新的函数（例如，没有名字，就像我上面提到的那样），在这个函数中，用参数调用你的函数，我试图实现的是一个图像上传器，它显示了图片的预览，如果你想点击它们，我想将其添加到一个隐藏的输入字段，这样我就可以在控制器（asp.net）中对所选文件做一些事情。我在asp.net方面没有太多经验，但我认为你需要将所选文件的名称设置为隐藏的输入字段，然后在后端检查输入[type=file]中上载的文件并根据所选文件名查找所选文件。就像你在
selectMain
中所做的那样，但是用C#代替。我按照你的建议只通过隐藏字段发送名称，然后在C#if（file.name==hiddenInputField）{//do stuff}你确定调用了
previewFiles（）
？如果是，您确定正在调用
readAndPreview（文件）
？如果是这样，您确定正在调用带有regex
/\（jpe？g | png）$/i.test（file.name）
的if语句吗？请不要忘记解释为什么您的答案可能是海报问题的答案：）
document.getElementById("primaryPhoto").value = file;