前戏：json
JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。
它基于 ECMAScript (w3c制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。
简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。
讲json对象 不得不提JS对象：
json对象： 字符串 数字 字典 数组 布尔值 null
属性名必须使用双引号 不能使用其他进制值 不能使用undefined 不能使用函数和日期对象
stringfy与parse方法
JSON.parse():用于将一个JSON字符串转换为 JavaScript对象
JSON.STRINGFY():用于将 JavaScript 对象转换为JSON 字符串
和XML的比较
JSON的优点 书写简单 符合JavaScriptu原生语法
但JSON内容比较多的时候可以使用在线工具BeJson,SoJson格式化结构
数据交换范例
def login(request):
obj={'name':"alex111"}
return render(request,'index.html',{"objs":json.dumps(obj)})
#----------------------------------
<script>
var temp={{ objs|safe }}
alert(temp.name);
alert(temp['name'])
</script>
Ajax简介
AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。
同步交互：客户端发出一个请求后，需要等待服务器响应结束后，才能发出第二个请求；
异步交互：客户端发出一个请求后，无需等待服务器响应结束，就可以发出第二个请求。
AJAX除了异步的特点外，还有一个就是：浏览器页面局部刷新；（这一特点给用户的感受是在不知不觉中完成请求和响应过程）
常见应用的场景是在网页的注册界面
提示用户名已经存在等 当光标移动到其他表单时 浏览器会使用AJAX技术向服务端发送请求
AJAX的优缺点
优点； AJAX使用 JavaScript技术向服务器发送异步请求；
AJAX无须刷新整个页面；
因为服务器响应内容不再是整个页面，而是局部，所以AJAX性能高
缺点： AJAX不适用于所有场景，很多时候还要使用同步交互；
AJAX虽然提高了用户体验，但是发送请求次数增加，服务器压力增大；
因为AJAX在浏览器中使用 JavaScript技术完成需要处理兼容性问题（使用jquery不需要考虑此问题）
不会AJAX,就什么特么都干不了，回家玩蛋去吧！
ajax的俩种使用方式：
$.ajax(settings);
$.ajax(url,(settings));
结合上课讲的例子来看
<body>
<p>用户名<input type="text" class="user"></p>
<br>
<button>ajax</button>
<script>
$(".user").blur(function () { 为input绑定blur方法
var user=$(this).val(); 取到输入的内容
$.ajax({
url:"/ajaxHandle/", 执行的url
type:"GET", 请求方式默认是get
data:{"username":user}, 传送到后端的数据
success:function(data){ success是回掉函数 成功的情况
data=JSON.parse(data); JSON序列化接收后端传来的内容
if (data["flag"]){
var $spans=$("<span>"); 创建标签显示用户已存在
$spans.text("用户已存在");
$("p").append($spans)
}
}
})
});
$("button").click(function () {
$.ajax({
url:"/ajaxHandle/",
type:"POST",
data:{"user":"egon"},
success:function (data) { 成功的情况
alert(data)
},
error:function () { 失败的情况 arguments可以
console.log(arguments) 显示全部的返回信息
},
complete:function () { 无论请求失败还是成功
alert(789) 都要执行的内容
},
statusCode:{ 根据状态码使用函数
'304': function () {
alert("not found!")
}
}
});
})
</script>
</body>
分页器（paginator）
函数的例子
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
def showBooks(req):
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
'''
book_list=[]
for i in range(100):
book_list.append(Book(title="book%s"%i,price=30+i*i))
Book.objects.bulk_create(book_list)
:param req:
:return:
'''
book_list_all=Book.objects.all()
p_obj=Paginator(book_list_all,20)
###############################p_obj
print(p_obj.count) # 100
print(p_obj.num_pages) # 5
print(p_obj.page_range) # [1,2,3,4,5]
#################################
page_num=req.GET.get("page")
try:
book_list=p_obj.page(page_num)
except EmptyPage:
book_list=p_obj.page(p_obj.num_pages)
except PageNotAnInteger:
book_list = p_obj.page(1)
return render(req, "showBook.html",locals())
范例在template中查看分页代码
<ul>
{% for book in book_list %}
<li>{{ book.title }} {{ book.price }}</li>
{% endfor %}
</ul>
<ul class="pagination">
{% if book_list.has_previous %}
<li><a href="/?page={{ book_list.previous_page_number }}">上一页</a></li>
{% else %}
<li class="disabled"><a href="#">上一页</a></li>
{% endif %}
{% for num in p_obj.page_range %}
<li><a href="/?page={{ num }}">{{ num }}</a></li>
{% endfor %}
{% if book_list.has_next %}
<li><a href="/?page={{ book_list.next_page_number }}">下一页</a></li>
{% else %}
<li class="disabled"><a href="#">下一页</a></li>
{% endif %}
</ul>
Paginator(obj,num) 要分组的内容 以及你要显示在每页的内容数目
p.count 数据总数
p.num_pages 总页数
p.page_range 页码的列表
p.page(1) 第一页的page对象
page.object_list 第一页的数据
page2.has_next() 是否有下一页
page2.has_previous() 是否有上一页 返回布尔值 可用if判断
page2.has_other_pages() 是否有其他页
page2.next_page_number() 下一页的页码
page2.previous_page_number() 上一页的页码
page2.start_index() 本页的第一条记录的序数
page2.end_index() 本页的最后一一条记录的序数
EmptyPage 超出页码的限制
PageNotAnInteger 未知页码的类型