我正在使用rails 3.2.11。我已经实现了文件上传概念。它适用于Firefox和Chrome浏览器。
表格
<iframe id="upload_target" name="upload_target" style="display:none;"></iframe>
<%= form_tag(url_for(:action => 'add_image'),
:target => 'upload_target',
:id => 'add_image_form',
:enctype => 'multipart/form-data', :multipart=>true) do %>
<%= text_field 'image_asset', 'name', :size => [60,40].min, :maxlength => "60", :id => "focus", :style=>"display:none", :value=>"site_logo" %>
<%= text_field 'image_asset', 'image_type', :value=>"Icon",:style=>"display:none"%>
<input type="file" id="file" name="image_form_file" size="36" style="display:none;" />
<a href="#" class="button" onclick="$('#file').click();">Upload a new logo image</a>
<a href="#" class="button green" onclick=" $('#add_image_form').submit();">Save</a>
<% end %>
JQuery的
$('#file').live("change",function() {
$('#add_image_form').submit();
setTimeout(function(){
$.ajax({
type: "GET",
beforeSend: function(xhr){ xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))},
dataType: "html",
url: "/get_image",
data: "record_id=<%= @page.id%>&format=html",
success: function(data){
$('#site_logo').html(data);
var new_image = $('#site_logo').find("img").attr('src');
},
error: function(){
}
});
}, 6000)
我在IE 9,IE 10浏览器中只有一个问题。 Java脚本控制台抛出“SCRIPT5:访问被拒绝。”
我尝试过允许文件夹位置的权限但没有用。 C:\ Users [USERNAME] \ AppData \ Local \ Microsoft \ Internet Explorer \ DOMStor C:\ Users [USERNAME] \ AppData \ Local \ Packages \ windows_ie_ac_001 \ AC \ Microsoft \ Intern et Explorer \ DOMStore
任何建议
由于
答案 0 :(得分:1)
尝试将按钮锚点包装在标签标签中:
<input type="file" id="file" name="image_form_file" size="36" style="display:none;" />
<label for="file" class="button">Upload a new logo image</label>
单击标签将触发文件输入而不会使Internet Explorer的表单无效。
(在IE9&amp; IE10中测试)
答案 1 :(得分:0)
对于JavaScript代码来说,无法使用iframe上传文件来确定IE10中服务器响应的HTTP状态代码。
https://cmlenz.github.io/jquery-iframe-transport/#section-13
您必须返回成功响应并评估json数据,以确定它是否成功。