在我的 Rails 应用程序中,我的表单中有一个 file_field 输入,以允许用户上传文件。当用户上传文件时,我使用 ajax 自动提交表单。它在 Safari 和 Chrome 中运行良好,但在 Firefox 中,当我单击“上传视频”按钮时,文件上传窗口(用户在其中选择要上传的文件)永远不会出现,并且表单会自动提交而没有任何文件.
让文件上传在 Firefox 中工作有什么特别之处吗?
这是我的代码:
<div id="uploadVideoWrapper" title="Add Video">
<button class="btn btn-primary uploadVideoButton">
Upload Video
</button>
<input class="video_file_upload_field" id="video_video_path" name="video[video_path]" onchange="return validateFileExtension(this)" type="file">
</div>
一旦用户上传文件(video.js.coffee.erb),我的 Ajax 将提交表单:
jQuery ->
$('#videoEmbedModal').fileupload
dataType: "script"
add: (e, data) ->
console.log('uploaded video')
types = /(\.|\/)(mov|mp4|avi)$/i
file = data.files[0]
size = file.size/(10e5)
size_limit = 25 # file size limit is 50 mb
if (types.test(file.type) || types.test(file.name)) && (size < size_limit)
$('#video_submit').html('Saving...')
$('#videoFileName').html(file.name)
$('.uploadVideoButton').attr('disabled', true)
$('.video_file_upload_field').attr('disabled', true)
$('.loadingIcon').show()
$('#images').append('<div class="placeholder video" style="background-image: none">uploading video...<br><%=image_tag("icons/loading.gif")%></div>');
$('.placeholder').hide();
data.context = $(tmpl("video-upload", file))
# $('#videoUploadProgress').append(data.context)
data.submit()
else if (size > size_limit)
alert("Your video is larger than 50 MB and cannot be uploaded. Please upload to Youtube or Vimeo and embed your video instead.")
else
alert("#{file.name} is not a supported video format")
progress: (e, data) ->
if data.context
progress = parseInt(data.loaded / data.total * 100, 10)
# data.context.find('.bar').css('width', progress + '%')
if progress == 100
setTimeout ( ->
$('.embedModal').modal('hide');
), 2000
$('.placeholder').show();
document.getElementById("images").scrollTop = document.getElementById("images").scrollHeight