输入类型文件隐藏点击

son*_*rma 3 html javascript jquery

我正在尝试使用以下查询来修改此上传按钮。

HTML:

 <input type="file" name="something" id="myfileid" style="display:none;">
Run Code Online (Sandbox Code Playgroud)

我尝试使用图像来替换<input type="file">“按钮”。

 <img src="some/thing/url/here" onclick="$('myfileid').click();">
Run Code Online (Sandbox Code Playgroud)

如您所见,这里我使用 ajax 将点击图像重定向到文件。尽管它似乎在 Safari 等主要浏览器中不起作用。另一边注:我已经将此代码添加到我网站上的许多页面,那么是否有一个简单的解决方案,我只需要添加一些 Javascript?谢谢。

Mi-*_*ity 6

如果它不必在 javascript 中解决,您可以通过将图像包装在 a 中来轻松实现这一点label for="myfileid",就像这样

JS小提琴

<label for="myfileid">
  <img src="//ninjaforms.com/wp-content/uploads/edd/2012/10/file-uploads1.png" width="250">
</label>
<input type="file" name="something" id="myfileid" style="display:none;">
Run Code Online (Sandbox Code Playgroud)