模擬點擊一個<input type =「file」/> jQuery，Opera

Question

我使用display none和輸入類型文件的形式，我也做了一個按鈕。當你點擊它時應該打開下載對話框。這種組合適用於除Opera之外的所有瀏覽器。開始工作，如果要刪除顯示：無;

<form id="imageform" method="post" enctype="multipart/form-data" action='' style="display: none;"> 
    <input type="file" name="photoimg" id="photoimg" /> 
</form> 
<input type="button" id="upload" value="upload"> 

的Jquery：

$('#upload').on("click", function() { 
    $('#photoimg').click(); 
}); 

請解釋，如何避免這種情況。

Answer 1

如果使用visibility: hidden代替display:none

，或者你可以用純CSS嘗試會更好。例如：

#photoimg { 
    left: -99999px 
} 

或

#photoimg { 
    z-index: -999 
} 

或

#photoimg { 
    width: 0px 
} 

或類似的

Answer 2

一些閱讀這篇文章。這是Opera bug。 http://my.opera.com/community/forums/topic.dml?id=1054112

Answer 3

代替把文件輸入元素display: none你可以這樣做的：

<div style="width:0;height:0;overflow:hidden;"> 
    <form id="imageform" method="post" enctype="multipart/form-data" action=""> 
     <input type="file" name="photoimg" id="photoimg" accept="image/*" 
      onchange="document.getElementById('imageform').submit();" /> 
    </form> 
</div> 
<button id="upload" onclick="document.getElementById('photoimg').click();"> 
Upload</button>