1
我正在使用jquery-fileupload-rails
Gem在我的應用程序中上載圖像。 下面是代碼:進度條在文件上傳後不會移除,jquery文件上傳
<script id="template-upload" type="text/x-tmpl">
<div class="upload ">
{%=o.name%}
<div class="progress"><div class="bar" style="width: 0%"></div></div>
<div class="photo-post-img">
<%= form_for Upload.new do |f| %>
<span class="btn btn-primary fileinput-button ml30">
<b>+</b>
<span class="text-orange">Add image</span>
<%= f.file_field :upload, multiple: true, name: "upload[upload]" %>
<%= f.hidden_field :post_id, :value => @post.upload_id %>
<%= f.hidden_field :upload_type, :value => @post.upload_type %>
</span>
<% end %>
<div class="img-upload-list">
<ul id="photos_uploaded" class="thumbnails pull-left">
<% @post.uploads.each do |upload| %>
<li class="thumbnail" id="uploads-<%=upload.id %>">
<%=image_tag upload.upload.url(:medium) %>
<%= link_to "Delete", upload, :remote => true, :method => "delete" %>
</li>
<% end %>
</ul>
</div>
而在.js文件:
jQuery(function() {
return $('#new_upload').fileupload({
dataType: "script",
add: function(e, data) {
var file, types;
types = /(\.|\/)(gif|jpe?g|png)$/i;
file = data.files[0];
if (types.test(file.type) || types.test(file.name)) {
data.context = $(tmpl("template-upload", file));
$('#new_upload').append(data.context);
return data.submit();
} else {
return alert("" + file.name + " is not a gif, jpeg, or png image file");
}
},
progress: function(e, data) {
var progress;
if (data.context) {
progress = parseInt(data.loaded/data.total * 100, 10);
return data.context.find('.bar').css('width', progress + '%');
}
},
done: function (e, data) {
$('.upload').attr('style', 'visibility: hidden');
}
});
});
每一件事工作正常,但圖片上傳後,進度條不刪除。上傳後如何刪除欄?
工程爲一次性使用。 但是,如果您已將它設置爲允許多個文件上傳,並說人上傳了一對夫婦檔案。無論它實現什麼,例如批量水印。如果他們去上傳更多,沒有進度條。 –