打开文件浏览器以选择要输入的文件类型=选择框选项更改时触发的文件

Opening file browser to select file for input type=file triggering on select box option change

本文关键字:文件 选择 选项 输入 类型 浏览器      更新时间:2023-09-26

我正试图打开输入类型文件的文件浏览器窗口,在选择框选项更改时触发。但它不起作用。你知道哪里出了问题以及如何解决吗?FWIW我试图从http://jsfiddle.net/afxDC这是针对文本字段的。

更新:-我发现这段代码适用于FF 28.0,但不适用于chrome 33.0.1750.152和Safari 7.0.3版(9537.75.14)。所以也需要在这些浏览器上运行

<html>
  <head>
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.js"></script>
    <style type="text/css">
      input[type=file] {
        display:block;
        height:0;
        width:0;
      }
    </style>
  </head>
  <body>
    <div class="item">
      <select id="media-selector">
          <option value=""></option>
          <option value="image">Add image</option>
          <option value="video">Add video</option>
      </select>
      <input type="file"/>
    </div>
    <script type="text/javascript">
      $("#media-selector").change(function() {
        $(this).parents(".item")
          .find('input[type=file]')
          .trigger('click');
      });
    </script>
  </body>
</html>

这里有一个解决方案-http://jsfiddle.net/afxDC/33/

jQuery-

$('#media-selector').change(function () {
    $(this).closest('.item')
        .find('input[type=file]')
        .trigger('click');
});

HTML

<div class="item">
    <select id="media-selector">
        <option value=""></option>
        <option value="image">Add image</option>
        <option value="video">Add video</option>
    </select>
    <input type="file" />
</div>