python - 使用 Django 和 AJAX 的动态 HTML 页面的最小示例-6ren

python - 使用 Django 和 AJAX 的动态 HTML 页面的最小示例

转载作者：行者123 更新时间：2023-11-28 02:27:38

24

4

我引用了以下帖子:

尽管有两个帖子和不错的答案，但我仍在努力为诉诸 Django 和 AJAX 的动态 HTML 页面构建一个最小的工作示例。

我必须遵循以下代码:

模型.py

from django.db import models


class Question(models.Model):
    question_text = models.CharField(max_length=200)
    pub_date = models.DateTimeField('date published')

urls.py

from django.conf.urls import url
from . import views

urlpatterns = [
    url(r'^$', views.index, name='index'),
    url(r'^get_more_tables', views.get_more_tables, name='get_more_tables')
]

views.py

from django.shortcuts import render
from .models import Question

def index(request):
    a = Question.objects.order_by('-pub_date')
    context = {'questions': a}
    return render(request, 'polls/index.html', context)

def get_more_tables(request):
    a = Question.objects.order_by('-pub_date')
    context = {'questions': a}
    return render(request, 'polls/get_more_tables.html', context)

index.html

<html>
<body>

<table id="_appendHere">
<tr><td> text </td></tr>

{% for a in questions %}
<tr><td>    {{ a.question_text }} </td></tr>
{% endfor %}

</table>
</body>
</html>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
var append_increment = 0;
setInterval(function() {
    $.ajax({
        type: "GET",
        url: "{% url 'get_more_tables' %}",
        data: {'append_increment': append_increment}
    })
    .done(function(response) {
        $('#_appendHere').append(response);
        append_increment += 10;
    });
}, 1000)

get_more_tables.html

{% for a in questions %}
<tr><td>    {{ a.question_text }} </td></tr>
{% endfor %}

我有以下问题:

根据 Console Error with Ajax: ReferenceError: $ is not defined ，我需要在 js 脚本中设置 js.file。如果我不这样做，我会收到“ReferenceError: $ is not defined”错误。为什么会这样，特别是因为这对于前面提到的帖子来说不是必需的？
如果我运行 http://localhost:8000/polls/ ，什么都没发生。我假设，当我使用
q2 = Question(question_text="What's up4?", pub_date=timezone.now())q2.save()

通过 python manage.py shell，应该显示整个内部数据库。然而，什么也没有发生。当我手动刷新网站时，会显示所有条目。

Mozilla 的检查器控制台没有显示任何条目。 Mozilla 的网络控制台确实显示访问了/pools 和外部 js 文件。但是，没有显示 1s 间隔的连续访问(不确定是否应该是这种情况)。

最佳答案

您的 HTML 无效，原因有几个。

首先，您将脚本 block 放在结束 </html> 之外标签。这意味着它在文档本身之外，浏览器可能无法读取。

更重要的是，您没有将代码放在适当的脚本元素中。您有一个开始标记，但您使用它通过 src 引用外部 jQuery 库属性。你根本没有结束标签

您需要将 jQuery 引用放在它自己的元素中，并为您自己的脚本使用适当的开始和结束标记。

<html>
<body>
<table>
...
</table>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
var append_increment = 0;
setInterval(function() {
    $.ajax({
        type: "GET",
        url: "{% url 'get_more_tables' %}",
        data: {'append_increment': append_increment}
    })
    .done(function(response) {
        $('#_appendHere').append(response);
        append_increment += 10;
    });
}, 1000)
</script>
</body>
</html>

关于python - 使用 Django 和 AJAX 的动态 HTML 页面的最小示例，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52899195/

24

4

0

文章推荐： javascript - Accordion 和搜索栏是行不通的

文章推荐： c++ - 我如何找出数组中的哪个元素具有最高值？

文章推荐： javascript:制作一个 iframe 来获取鼠标的 x&y

文章推荐： c++通过模板实例化类

IPv6 示例 Wireshark 示例
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: Sample data for IPv6? 除了 wireshark 在其网站上提供的内容之外，是否有可以下
c# - WPF 中的多拖放——示例/示例/教程？
我正在寻找可以集成到现有应用程序中并使用多拖放功能的示例或任何现成的解决方案。我在互联网上找到的大多数解决方案在将多个项目从 ListBox 等控件拖放到另一个 ListBox 时效果不佳。谁能指出我
java - GATE Embedded 示例示例 NoClassFound 错误
我是 GATE Embedded 的新手，我尝试了简单的示例并得到了 NoClassDefFoundError。首先我会解释我尝试了什么在 D:\project\gate-7.0 中下载并提取 Ga
eclipse-rcp - Eclipse 中的 JFace 示例，如 SWT 示例？
是否有像 Eclipse 中的 SWT 示例那样的多合一 JFace 控件示例？搜索(在 stackoverflow.com 上使用谷歌搜索和搜索)对我没有帮助。如果它是一个独立的应用程序或 ecl
google-compute-engine - Google 计算引擎 .NET API 示例/示例/教程
我找不到任何可以清楚地解释如何通过 .net API(特别是 c#)使用谷歌计算引擎的内容。有没有人可以指点我什么？附言我知道 API 引用 ( https://developers.google.
基于Basicauth的一个C#示例
最近在做公司的一个项目时，客户需要我们定时获取他们矩阵系统的数据。在与客户进行对接时，提到他们的接口使用的目前不常用的BASIC 认证。天呢，它好不安全，容易被不法人监听，咋还在使用呀。但是没办法呀，
基于Basicauth的一个C#示例
最近在做公司的一个项目时，客户需要我们定时获取他们矩阵系统的数据。在与客户进行对接时，提到他们的接口使用的目前不常用的BASIC 认证。天呢，它好不安全，容易被不法人监听，咋还在使用呀。但是没办法呀，
YAML 示例
我正在尝试为我的应用程序设计配置文件格式并选择了 YAML。但是，这(显然)意味着我需要能够定义、解析和验证正确的 YAML 语法! 在配置文件中，必须有一个名为 widgets 的集合/序列。 .这
python - 示例
你能给我一个使用 pysmb 库连接到一些 samba 服务器的例子吗？我读过有类 smb.SMBConnection.SMBConnection(用户名、密码、my_name、remote_name
示例：iptables限制ssh链接服务器
linux服务器默认通过22端口用ssh协议登录，这种不安全。今天想做限制，即允许部分来源ip连接服务器。案例目标：通过iptables规则限制对linux服务器的登录。处理方法：编
Sonarqube PostProjectAnalysisTask 示例？
我一直在寻找任何 PostProjectAnalysisTask 工作代码示例，但没有看。 This页面指出 HipChat plugin使用这个钩子(Hook)，但在我看来它仍然使用遗留的 Po
GWT CustomScrollPanel 示例
我发现了 GWT 的 CustomScrollPanel 以及如何自定义滚动条，但我找不到任何示例或如何设置它。是否有任何示例显示正在使用的自定义滚动条？最佳答案这是自定义 native 滚动条的
Marionette CRUD 示例
我正在尝试开发一个 Backbone Marionette 应用程序，我需要知道如何以最佳方式执行 CRUD(创建、读取、更新和销毁)操作。我找不到任何解释这一点的资源(仅适用于 Backbone)。
Android BLE 示例
关闭。这个问题需要details or clarity .它目前不接受答案。想改进这个问题？通过 editing this post 添加详细信息并澄清问题. 去年关闭。 Improve this
将多个实例提交到数据库的表单的 Django 示例？
我需要一个提交多个单独请求的 django 表单，如果没有大量定制，我找不到如何做到这一点的示例。即，假设有一个汽车维修店使用的表格。该表格将列出商店能够进行的所有可能的维修，并且用户将选择他们想要进
spring - MultiTenantSpringLiquibase 示例。
我有一个 Multi-Tenancy 应用程序。然而，这个相同的应用程序有 liquibase。我需要在我的所有数据源中运行 liquibase，但是我不能使用这个 Bean。我的应用程序.yml
业务应用程序的 TDD 示例
我了解有关单元测试的一般思想，并已在系统中发生复杂交互的场景中使用它，但我仍然对所有这些原则结合在一起有疑问。我们被警告不要测试框架或数据库。好的 UI 设计不适合非人工测试。 MVC 框架不包括一
Clojure For Comprehension 示例
我正在使用 docjure并且它的 select-columns 函数需要一个列映射。我想获取所有列而无需手动指定。如何将以下内容生成为惰性无限向量序列 [:A :B :C :D :E ... :A
yii - findByAttributes 示例
$condition使用说明和 $param在 findByAttributes在 Yii 在大多数情况下，这就是我使用 findByAttributes 的方式 Person::model()->f
未启用 qtcreator 示例
我在 Ubuntu 11.10 上安装了 qtcreator sudo apt-get install qtcreator 安装的版本有:QT Creator 2.2.1、QT 4.7.3 当我启动

首页

博学

6Ren·AI

商城

python - 使用 Django 和 AJAX 的动态 HTML 页面的最小示例