Cha*_*esS 4 python django jquery
当用户点击链接时,如何在链接下方打开一个div,通过AJAX加载它的内容?
谢谢您的帮助; 我找不到怎么样.只是在加载页面时静态填充服务器端的div工作正常,但它的内容太多了.
如果有人有一个特定的Django版本,我有点想找一个?
Ben*_*end 12
jQuery.load正是这样做的:
$("div#my-container").load("/url/to/content/ #content-id")
Run Code Online (Sandbox Code Playgroud)
这将从中获取内容/url/to/content/,对其进行过滤并将#content-id结果注入其中div#my-container.
编辑:关于这一点,Django并没有什么特别的,因为它都是客户端的.但如果你坚持......
templates/base.html
<html>
<head>
<title>My funky example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
{% block extrahead %}{% endblock %}
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
templates/page.html
{% extends "base.html" %}
{% block extrahead %}
<script type="text/javascript">
$(function(){
$('a.extendable').click(function(){
$(this).after($('<div class="external-content"></div>').load($(this).attr('href') + ' #content'));
return false;
});
});
</script>
{% endblock extrahead %}
{% block content %}
<p>Hi! <a href="/external/content/a/" class="extendable">Click here</a> and wait for something funny to happen!</p>
<p><a href="/external/content/b/" class="extendable">This link</a> is cool, too!</p>
{% endblock content %}
Run Code Online (Sandbox Code Playgroud)
templates/a.html
{% extends "base.html" %}
{% block content %}
<div id="content">so long and thanks for all the fish</div>
{% endblock %}
Run Code Online (Sandbox Code Playgroud)
templates/b.html
{% extends "base.html" %}
{% block content %}
<div id="content">Don't panic</div>
{% endblock %}
Run Code Online (Sandbox Code Playgroud)
urls.py
from django.conf.urls.defaults import *
urlpatterns = patterns('django.views.generic.simple',
(r'^$', 'direct_to_template', {'template': 'page.html'}),
(r'^external/content/a/$', 'direct_to_template', {'template': 'a.html'}),
(r'^external/content/b/$', 'direct_to_template', {'template': 'b.html'}),
)
Run Code Online (Sandbox Code Playgroud)
您可以在此处下载所有代码.
| 归档时间: |
|
| 查看次数: |
2857 次 |
| 最近记录: |