IE10通過ajax使用display：none文件輸入發送FormData對象

Question

發送包括display：none通過ajax的文件輸入表單時遇到一些麻煩。在Chrome（46.0.2490.71）中，它工作正常，但在IE10（10.0.9200.17492）中。到目前爲止，我還沒有成功解決這些問題，上傳IE10也很重要。

我有一個具有多個輸入元素的窗體。其中之一是輸入文件。我模擬使用jQuery輸入文件點擊：

$('.file-upload span').click(function() { 
 
     $(this).parent().find('input[type=file]').click(); 
 
});

<div class="col-xs-8 col-sm-7 col-md-4 col-lg-4 input-group file-upload" data-field-name="FILENAME"> 
 
     <input type="file" name="p_doc" class="form-control" placeholder="" maxlength="2000" id="FILENAME"> 
 
     
 
     <input type="text" class="form-control hidden" value="" readonly=""> 
 
     
 
     <span class="input-group-addon" title="Search for file..."> 
 
     <span class="glyphicon glyphicon-folder-open"></span> &nbsp;Browse 
 
     </span> 
 
     <input type="hidden" name="p_arg_values" value=""> 
 
</div>

我已經嘗試了幾種可能性，你可以看到下面。我在互聯網上尋找解決方案，但找不到解決我的麻煩的任何事情。我知道在IE10中formData是支持的。

formData = new FormData(); 
 
var inputFiles = $('#FILENAME').get(0); 
 
formData.append('p_doc', inputFiles.files[0]); 
 

 
$('form input[type!=hidden][name=p_arg_values]').each(function() { 
 
    formData.append($(this).attr('name'), $(this).val()); 
 
});

formData = new FormData(); 
 
formData.append('p_doc', $('form input[type=file]')[0].files[0]); 
 

 
$('form input[type!=hidden][name=p_arg_values]').each(function() { 
 
    formData.append($(this).attr('name'), $(this).val()); 
 
});

如果我不設置顯示它的工作：與下列直接沒有輸入文件和我們的輸入文件碼。但是，如果輸入文件隱藏，則會顯示錯誤「SCRIPT5：Access is denied」。

formElement = document.querySelector("form"); 
 
formData = new FormData(formElement);

的FORMDATA對象已建成後，將通過AJAX發送到Oracle過程。

$.ajax([ORACLE_PROCEDURE], { 
 
     processData: false, 
 
     contentType: false, 
 
     data: formData, 
 
     method: 'POST' 
 
})

誰能幫助解決？

Answer 1

IE對文件輸入操縱有嚴格的安全策略（getting access is denied error on IE8）。
你可以做的是使文件輸入的不透明度爲1％，並將其放在按鈕上。用戶會認爲他們正在按下按鈕，但實際上是正在被點擊的文件輸入。