我使用jquery表单js上传实时图像。下面是我的代码。
HTML
<form id="imageform" name="imageform" method="POST" enctype="multipart/form-data" action="ajax/ajax_quotation_imageUpload.php" >
<div class="form-group col-md-12" style="margin-bottom: 0px;">
<label>Select Image File :</label>
<input type="file" class="form-control qimage" name="qimage">
</div>
<img src="images/loader2.gif" id="loader" style="display: none;">
<div class="clearfix"></div>
</form>
脚本
$('.qimage').on('change', function(){
$('#loader').show();
$(".qimage").attr("disabled", "true");
$("#imageform").ajaxForm({
success: function(data) {
alert(data);
}
}).submit();
});
PHP PAGE
$filename = stripslashes($_FILES['qimage']['name']);
echo $filename;
这是我的完整代码。每当我上传文件它返回未定义的qimage。我在哪里得到错误的代码?
答案 0 :(得分:1)
在提交表单数据$(".qimage").attr("disabled", "true");
之前禁用文件输入元素,因此不会提交其数据。
提交详细信息后禁用它。
答案 1 :(得分:-2)
在HTML5之前,有一堆技术和插件可供jQuery实现AJAX文件上传。 HTML5引入了可以简化文件上传的FormData类。 要构造包含现有数据的FormData对象,请在创建FormData对象时指定该表单元素:
var formData = new FormData(someFormElement);
有关FormData()的更多信息,请参阅文档https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects
HTML
<form id="imageform" name="imageform" method="POST" enctype="multipart/form-data">
<div class="form-group col-md-12" style="margin-bottom: 0px;">
<label>Select Image File :</label>
<input type="file" class="form-control qimage" name="qimage">
</div>
<img src="images/loader2.gif" id="loader" style="display: none;">
<div class="clearfix"></div>
</form>
的jQuery
<script>
$(document).ready(function(e) {
$('.qimage').change(function() {
if (window.FormData){
var formdata = new FormData($('#imageform'));
}else{
var formData = $('#imageform').serialize();
}
$.ajax({
type: 'POST',
url: 'ajax/ajax_quotation_imageUpload.php',
data: formData,
cache: 'false',
success: function(res) {
alert(res);
}
});
return false;
});
});
</script>
PHP代码
<?php
$filename = stripslashes($_FILES['qimage']['name']);
echo $filename;
?>