使用Python的Django框架结合jQuery实现AJAX购物车页面
Django中集成jquery
首先,静态的资源通常放入static文件夹中:
static/ css/ djquery.css samples/ hello.css js/ jquery-1.7.1.min.js samples/ hello.js
其中css和js都按照应用名称(这里是samples)划分文件夹,如果文件较多,还可以再划分子文件夹。
Django通常使用模板来展现html,而且我们通常使用继承的模板,所以需要将共用的元素,比如全局的css,对jquery.js的引入等,写到base模板中,而将具体页面的元素放到具体的模板中。这就牵涉到如何嵌套的问题。看下面的例子:
base.html
<html>
<head>
<metacharset="utf-8">
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"/>
<title>{%blocktitle%}标题{%endblock%}</title>
<linkhref="css/djquery.css"rel="stylesheet">
{%blockstyles%}<!--customstyles-->{%endblock%}
</head>
<body>
<divid="container">
{%blockcontent%}内容{%endblock%}
</div>
</body>
<scriptlanguage="JavaScript"type="text/javascript"src="/static/js/jquery-1.7.1.min.js"></script>
{%blockscripts%}
<!--customscripts-->
{%endblock%}
</html>
samples/hello.html
{%extends"base.html"%}
{%blocktitle%}
hello,djquery!
{%endblock%}
{%blockstyles%}
{%endblock%}
{%blockcontent%}
<div><inputtype="button"id="myField"value="Clickme!"/></div>
{%endblock%}
{%blockscripts%}
<scriptlanguage="JavaScript"type="text/javascript"src="/static/js/djquery/hello.js"></script>
{%endblock%}
Hello,Djquery!
有了上述的“框架”,我们就可以很容易的验证一下我们的想法,比如这个“HelloDjquery”。只需要在urls.py中配置一下:
(r'hello/$','django.views.generic.simple.direct_to_template',{'template':'samples/hello.html'}),