Question

我需要动态创建fileinput元素。

问题：我无法绑定到IE上的更改事件。试过

.change(function(){}); .bind('click',function(){}); .on('click', function(){});

请参阅我的Codepen进行演示：

<a href="#" id="fileInput">Click me</a>

$('#fileInput').click(function(){
      var fileSelector = document.createElement("input");
      fileSelector.setAttribute('type', 'file');

      fileSelector.click();
      $(fileSelector).change(function (e) {
        alert("file changed");
      });
})

Answer 1

这似乎是IE安全问题。您无法触发文件上载按钮单击。用户需要实际点击上传按钮。

当我尝试设置上传的浏览按钮时，我遇到了这个问题，我最终做的是使用位置相对和不透明度为0的样式按钮顶部输入，因此用户实际上是单击文件上传输入而不是按钮。

[type=file]
{
    opacity:0;
    position: relative;
    left: -63px;
    width: 58px;
}

在此处subplots_adjust

P.S。如果此代码在IE中适用于您，则问题可能是该元素未添加到dom中。尝试用此

替换您的JavaScript

$('#fileInput').click(function(){
  var fileSelector = document.createElement("input");
  fileSelector.setAttribute('type', 'file');
  fileSelector.setAttribute('hidden', 'true');
  $("body").append(fileSelector);
  fileSelector.click();

  $(fileSelector).change(function (e) {
    alert("file changed");
  });
})

动态创建的fileinput不会绑定到IE上的更改事件

1 个答案: