0

我试图使用带有代码（简化）的不可见元素示例通过引导程序获得更好看的文件输入表单元素，例如：

<div class="container">
  <form enctype="multipart/form-data" action="">
    <input class="hide" id="filesel" type="file" />
    <div class="input-append">
      <input id="filename" class="input-large" type="text" />
      <a class="btn" onclick="testFun();">Browse</a>
    </div>
  </form>
</div>

<script type="text/javascript">
  $('input[id=filesel]').change(function() {
  $('#filename').val($(this).val());
  });

  function testFun(){
  inp = $("#filesel").click();
  }
</script>

但它没有按预期工作。如果我将hide类删除到文件输入标签，它就可以工作。我该如何解决？

更新 1：用更多的导航器测试：

  • Ubuntu Chromium 18.0 -> 失败
  • Ubuntu Firefox 16.0 -> 工作

我在 Chromium 中的hideorstyle="display: none"也影响文件浏览窗口。

4

2 回答 2

1

设置display:none;不适用于文件输入。虽然你可以设置visibility:hidden;或这里opacity:0; 还有一个关于样式文件输入的不错的教程

于 2013-05-30T09:27:11.620 回答
1

如果您删除您的hide课程并添加style="display: none"（根据示例）会发生什么？

于 2013-05-30T09:18:15.853 回答