display: inline-block;
background-color: #ef4300;
cursor: pointer;
width: 100px;
height: 35px;
text-align: center;
position: absolute;
line-height: 35px;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 99;
}
.file {
width: 100px;
height: 35px;
text-align: center;
position: absolute;
line-height: 35px;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 100;
opacity: 0;
}
{% csrf_token %}var csrftoken= $.cookie(‘csrftoken‘);//第一种上传方式 iframe
function iframesubmitForm() {
$(‘#ifm2‘).load(function(){
var text= $(‘#ifm2‘).contents().find(‘body‘).text();
var obj=JSON.parse(text);
console.log(obj);
})
}//第二种上传方法 ajax
function ajaxSubmit() {
var fileobj= document.getElementById(‘i1‘).files[0];
console.log(fileobj);
var fd= new FormData(); //依赖FormData对象
fd.append(‘username‘, ‘root‘);
fd.append(‘upload‘, fileobj);
$.ajax({
url:‘/xiaoqing/upload_file/‘,
type:‘POST‘,
data: fd,
processData: false,
cententType: false,
headers: {‘X-CSRFtoken‘: csrftoken},
success: function(arg,a1,a2){
console.log(arg);
console.log(a1);
console.log(a2);
}
})
}//第三种上传方法 xhr对象
function xhrSubmit() {
var fileobj= document.getElementById(‘i1‘).files[0];
console.log(fileobj);
var fd= new FormData(); //依赖FormData对象
fd.append(‘username‘,‘root‘);
fd.append(‘upload‘,fileobj);
var xhr= new XMLHttpRequest(); //创建对象
xhr.open(‘POST‘,‘/xiaoqing/upload_file/‘,true);
xhr.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded; charset-UTF-8‘); //POST请求必须设置
xhr.setRequestHeader(‘X-CSRFtoken‘,csrftoken);
xhr.send(fd);
xhr.onreadystatechange=function() {if(xhr.readyState == 4){
var obj= JSON.parse(xhr.responseText); //返回值
console.log(obj);
}
}
}