javascript - 点击事件在javascript中调用django url

Question

我在模板中得到了一个 javascript onclick 事件，我想从中调用一个带有 id 参数的 Django url，如下所示：

$(document).on('click', '.alink', function () {
        var id = $(this).attr('id');
        document.location.href ="{% url 'myapp:productdetailorder' id %}"
});

当然，这根本不起作用。任何想法 ？

提前致谢 ！！

Answer 1

我认为最好的方法是创建一个data-*带有在模板中呈现的 URL 的 html 属性，然后使用 javascript 来检索它。

这样可以避免将 js/django 模板的东西混合在一起。此外，我将所有 JS 保存在视图之外的单独文件中（这通常是一种更好的做法），因此尝试混合这两者是行不通的。

例如，如果你有一个你想要的 url，只需创建一个 html 隐藏元素：

<input type="hidden" id="Url" data-url="{% url 'myapp:productdetail' id %}" />

然后，在你的 JS 中：

$(document).on('click', '.alink', function () {
    var url = $("#Url").attr("data-url");
});      

我经常将这种模式用于下拉列表，这样我就不必在第一次渲染页面时提供所有选项（这通常会加快速度）。

Answer 2

您正在尝试访问在用户单击后端 Django 模板中的前端时创建的 javascript 变量。但是，您已经知道它不会起作用。

更好的选择是在 javascript 中重建 url：

$(document).on('click', '.alink', function () {
    // Generate URL without "id" bit
    var url = "{% url 'myapp:productdetail' %}";

    var id = $(this).attr('id');

    // Construct the full URL with "id"
    document.location.href = url + "/" + id;
});

如果您没有可以返回所需 URL 的 django url 帮助程序，则可以打印出任何内容并简单地用 javascript 替换它，如下所示：

$(document).on('click', '.alink', function () {
    var url = "{% url 'myapp:productdetail' 123 %}";
    var id = $(this).attr('id');

    // Construct the full URL with "id"
    document.location.href = url.replace('123', id);
});

Answer 3

问题似乎在于您在 js 静态文件中使用 django 模板语言（对吗？）尝试将该变量移动到 html 模板文件，例如：

<script type=text/javascript>
var a = "{% url'myapp:productdetail' id %}" </script>

在静态 js 文件中：

document.location.href = a;

Answer 4

您可以使用 javascript 代码“window.location.origin”，这将给出基本 url，然后您可以添加“/pathname”

Answer 5

你不需要通过任何...

写。

 location.href = "/" + id

就这样。