formdata对象上传文件

最新推荐文章于 2024-08-09 21:54:00 发布

原创最新推荐文章于 2024-08-09 21:54:00 发布 · 756 阅读

0 ·

CC 4.0 BY-SA版权

js 同时被 2 个专栏收录

34 篇文章

订阅专栏

html5

7 篇文章

订阅专栏

本文介绍了一个用于导入Excel文件的表单及其相关JavaScript脚本。该表单允许用户选择要导入的文件类型（出售房源或出租房源），并提供了一个示例Excel文件供下载。通过使用XMLHttpRequest实现了文件的异步上传，并提供了反馈信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div>
<form id="daorucaozuo" onsubmit="return daorucaozuo();" enctype="multipart/form-data">

<div class="form-group">
<input class="img-thumbnail borr_no" style="display:inline-block;width:200px;" type="file" id="excelfile" name="excelfile">
<input type="hidden" name="type" value="{$type}">
<p class="help-block" style="padding:5px 0px;">
<span>
<?php if($type==1): ?>
<p><a href="__ROOT__/Public/Admin/出售房源表.xls"><i class='fa fa-file-excel-o fonta'></i> 出售房源Excel表格>>></a></p>
<?php else: ?>
<p><a href="__ROOT__/Public/Admin/出租房源表.xls"><i class='fa fa-file-excel-o fonta'></i> 出租房源Excel表格>>></a></p>
<?php endif; ?>
</span>
</p>
</div>
<button type="submit" style="width: 100px;" class="btn btn-default btn-sm btn-primary btn-block borr_no">确定导入</button>

</form>
</div>
<script>

function daorucaozuo(){

$('#tanchuceng').modal('hide');

var type = $("#daorucaozuo").find('input[name=type]').val();
var fileObj = document.getElementById('excelfile').files[0]

var urls = "{:U(MODULE_NAME.'/Houses/insertExcelClientLists')}"; // 接收上传文件的后台地址
// FormData 对象
var form = new FormData();
form.append("type", type); // 文件对象
form.append("excelfile", fileObj); // 文件对象
// XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
xhr.open("post", urls, true);
xhr.send(form);

$("#bukebianjiceng").css("display","block");
setTimeout(function(){
$("#ajax").show(500);
},500);

xhr.onreadystatechange = function(){
setTimeout(function(){
if(xhr.readyState == 4 && xhr.status == 200){
var b = xhr.responseText;
if(b=='true'){

$("#ajax").hide(500,function(){
bcymsg("操作成功！");
location.reload(false);
});

}else{

$("#ajax").hide(500,function(){
bcymsg(b);
$("#bukebianjiceng").css("display","none");
});

}
}
},3000);

}
return false;

}

function UpladFile(tt,i,w,h) {
var fileObj = tt; // 获取文件对象
var FileController = "/Admin/Images/postsImgs.html"; // 接收上传文件的后台地址
// FormData 对象
var form = new FormData();
form.append("width", w); // 可以增加表单数据
form.append("height", h); // 可以增加表单数据
form.append("postsImgs", fileObj); // 文件对象
// XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
xhr.open("post", FileController, true);
xhr.send(form);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
var b = xhr.responseText;
if(b!='false'){
$(".imghead").eq(i).attr("src","/"+b);
$(".imgInput").eq(i).val(b);
}else{
alert("上传失败，稍后再试");
}
}
}
}

</script>