javascript - 动态加载页面时 Django url 标记不起作用

标签 javascript django url tags

这是我第一次发问题,所以我会尽可能简洁。

我正在尝试在登录时动态填充页面的 HTML。对于前端应用程序,我使用 Django + HTML 和 CSS。我想向现有的“ul”动态添加“li”项。

之前的代码,当页面静态加载时是:

<ul id="marketplace-list">
  <li id="shoes-marketplace-dropdown" class="dropdown dropdown-toggle">
    <a href="{% url 'shoes_marketplace' %}">Shoes</a>
    <ul class="dropdown-menu" role="menu">
      <li><a href="{% url 'shoes_men' %}">Men</a></li>
      <li><a href="{% url 'shoes_women' %}">Women</a></li>
    </ul>
  </li>
</ul>

单击“Men”href 时,我的浏览器将重定向到以下 URL:http://localhost:9000/marketplaces/shoes/men/

现在我创建了一个 js 变量,其中包含 ID 为“shoes-marketplace-dropdown”的“li”标签。 我计划在 $(document).ready( function {...}) 中的上述标签中动态添加和创建 ID 为“marketplace-list dynamically”的“ul”标签。

我的做法是:

var shoes_market = " <li id=\"shoes-marketplace-dropdown\" class=\"dropdown dropdown-toggle\">" +
                    " <a href=\"{% url \'shoes_marketplace\' %}\">Shoes</a>" +
                    " <ul class=\"dropdown-menu\" role=\"menu\">" +
                       " <li><a href=\"{% url \'shoes_men\' %}\">Men</a></li>" +
                       " <li><a href=\"{% url \'shoes_women\' %}\">Women</a></li>" +
                    " </ul>" +
                   "</li>";

在 $(document).ready() 函数中我有:

$("#marketplace-list").prepend(shoes_market)

HTML 页面构建正确,但是当我单击“Men”链接时,在浏览器中会看到以下 URL:

http://localhost:9000/%7B%%20url%20 'shoes_men'%20%%7D

url在urls.py中定义如下"<​​/p>

url(r'^marketplaces/shoes/men/$', views.shoes_men, name='shoes_men')

我的猜测是,不知何故,包含 url 的 HTML 代码(作为字符串放置在 javascript 中)不会通过 urls.py 中定义的 Django 解析为其关联值。你能帮我么?我不知道如何解决这个问题。

提前致谢!

最佳答案

出现此问题是因为您的 URL 标记是在 JS 而不是 HTML 中,并且 Django 模板引擎不适用于 JS 静态文件。如果你真的想继续使用 JS 实现,那么在 HTML 模板中创建带有变量的脚本标签

<script>
var men_shoe_link = {% url 'shoes_men' %}
</script>

然后你可以在 JS 中使用这个变量,因为你的代码在 $(document).ready() 函数中,首先你的 var 将被创建,然后 JS 文件将被处理。 那么现在在 JS 字符串中你可以拥有

"<a href='${men_shoe_link}'>Shoes</a>"

关于javascript - 动态加载页面时 Django url 标记不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59752034/

相关文章:

javascript - 选择时更改背景

javascript - 作为参数给出时返回 ID 元素

javascript - 暂停 setInterval 然后继续时遇到问题

r - 在 R 中使用 readLines(url) 时如何避免 "too many redirects"错误?

javascript - 如何通过 aws-sdk(javascript 或 Node )获取 s3 存储桶大小

django - 如何制作同时执行 GET 和 POST 的 Django View ?

python - @action 的 Django Rest Framework url_pattern

python - 如何将选择显示名称传递给 Django REST 框架中的模型序列化?

url - 来自 Google 网站站长工具的重复页面

c# - 如何发送带有查询字符串的 URL 作为查询字符串