使用Jquery点击隐藏文件上传按钮?

Pom*_*ter 5 javascript jquery file-upload click button

我有一个隐藏文件上传,因为它看起来很糟糕,我显示了一个更好看的按钮,并希望它在点击隐藏文件上传时点击它。

function ClickUpload() {
    $("#FileUpload").trigger('click');
}

<div id="MyUpload">
    <span id="FileName">Choose File</span>
    <input id="uploadButton" type="button" value="Upload" onclick="ClickUpload()"> 
</div>
<div id="hideUglyUpload">
    <input type="file" name="FileUpload" id="FileUpload"/>
</div>
Run Code Online (Sandbox Code Playgroud)

到目前为止,我可以进入函数 ClickUpload() 但它只是通过单击而没有弹出文件选择窗口。

sil*_*ter 5

我不想在标记中使用内联 JS 函数调用......所以有点改变......

   $(document).ready(function() {
      $('#uploadButton').on('click',function(evt){
         evt.preventDefault();
         $('#FileUpload').trigger('click');
     });
  });

<div id="MyUpload">
    <span id="FileName">Choose File</span>
    <input id="uploadButton" type="button" value="Upload"> 
</div>
<div id="hideUglyUpload">
    <input type="file" name="FileUpload" id="FileUpload"/>
</div>
Run Code Online (Sandbox Code Playgroud)


nic*_*ael 4

奇怪的是它不起作用。尝试

<input id="uploadButton" type="button" value="Upload" onclick='$("#FileUpload").click()'> 
Run Code Online (Sandbox Code Playgroud)

  • 这和OP的方法有什么区别? (3认同)