当我们在名字栏输入数据后并且失去焦点后，就会触发一个ajax请求，它会把写在名字栏的数据发到服务器，服务器从数据库判断是否用户名已经存在，然后给ajax返回一个结果。这整个过程中，页面是不会刷新的。只是通过java script在页面上添加节点而已
user=alex&pwd=123 这就是这种方式打包后的数据结构
$('.submit').click(function () {
var formdata=new FormData();
formdata.append('file',$('.file')[0].files[0]); #插入上传文件的内容
$.ajax({
url:'/file/',
type:'post',
contentType:false, #这一句和下一句是必须加上的
processData:false,
data:formdata,
success:function (data) {
$('.c1').html(data)
}
})
})
如果不用Json类型打包的话，ajax也会默认urlencoded模式打包，数据书写格式为：
data：{user:'hh',pwd:123}
但当设置contentType='json'，此时数据打包方式就变了，数据必须是json格式，所以现在该如下面这样写
data：JSON.strinigfy({user:'hh',pwd:123})
<form action="" method="post" enctype="multipart/form-data">
{% csrf_token %}
<input type="file" name="file">
<input type="submit">
</form>
def file(request):
if request.method=='GET':
return render(request,'file.html')
else:
file_obj=request.FILES.get('file')
name=file_obj.name
with open(os.path.join('imgs',name),'wb') as f:
for line in file_obj:
f.write(line)
return HttpResponse('上传成功')
<input type="file" class="file">
<input type="button" class="submit" value="submit">
<p class="c1"></p>
<script>
$('.submit').click(function () {
var formdata=new FormData();
formdata.append('file',$('.file')[0].files[0]);
$.ajax({
url:'/file/',
type:'post',
contentType:false,
processData:false,
data:formdata,
success:function (data) {
$('.c1').html(data)
}
})
})
</script>
def file(request):
if request.method=='GET':
return render(request,'file.html')
else:
file_obj=request.FILES.get('file')
name=file_obj.name
with open(os.path.join('imgs',name),'wb') as f:
for line in file_obj:
f.write(line)
return HttpResponse('上传成功')
