Append Django 模板標簽與 Jquery

Question

我想構建一個菜單，我可以在其中設置一個使用 {% block %} 標簽突出顯示的鏈接。 我的 Javascript 中有這樣的東西：

<loop>
$('#a-div').append('{% block ' + variable + ' %} <a href...</a> {% endblock %}')
<endloop>

在源代碼中，這顯示為“{% block Home %}”

我怎樣才能將 JQuery 不是 append 作為字符串而是作為模板標簽？

Answer 1

你不能。 至少在沒有向 Django 模板發出 AJAX 請求的情況下並非如此。 在您的情況下，它會很慢並且會提出不必要的額外請求。 這不值得。 您可以通過 jQuery 插入來自 Django 模板的片段，例如使用 jQuery load ZC1C425268E68385D14ZA77。 但是您不能替換特定的{% block %}標簽，因為在 jQuery 運行時，模板已經被處理（並且對塊標簽的引用被刪除）。 但無論如何，這不是你應該這樣做的情況。

為什么不使用 CSS class 突出顯示菜單？ 這是我對這個問題的常用解決方案：

1. 在您的一個templatetags文件夾中創建一個名為base_extras.py的文件。 如果您沒有，請在適當的文件夾中創建一個。

2. 在base_extras.py中，粘貼以下代碼：

    from django import template from django.core.urlresolvers import reverse register = template.Library() @register.simple_tag def navactive(request, urls): if request.path in ( reverse(url) for url in urls.split() ): return "active" return ""

3. 現在，在您的模板中，在基本模板的菜單上，執行以下操作：

    <ul class="menu"> <li class="home {% navactive request 'home' %}"><a href="{% url home %}">Home</a></li> <li class="contact {% navactive request 'contact' %}"><a href="{% url contact %}">Contact</a></li> <li class="signup {% navactive request 'signup' %}"><a href="{% url signup %}">Sign up</a></li> </ul>

4. 這將使您的 URL 當前所在的菜單具有active的 class。 然后，在您的 CSS 中，只需為具有active的菜單項添加一個特殊的 class，使其看起來與其他菜單略有不同。

    ul.menu li.active {background: red; color: white;}

如果您碰巧需要使用 jQuery 更改活動菜單，您可以刪除所有菜單上的active class，並將其添加到新選擇的菜單中：

$('ul.menu li').removeClass('active').find('.home').addClass('active'); // for example

Answer 2

你不能那樣做。 Django 模板標簽在服務器端處理，甚至在頁面發送到瀏覽器之前。 另一方面，在從服務器接收到頁面后，在瀏覽器中調用 Javascript（包括 jQuery）。

您可以做的是將{% block %}標記的內容預渲染到 JS 變量並在 jQuery 代碼中使用它：

var blockContent = "{% block Home %} ... {% endblock %}";
// ...
$("#a-div").append(blockContent);

如果您需要從多個塊中進行選擇（正如您在提供的代碼示例中所指出的那樣），您可以求助於一組預渲染塊。

Answer 3

您最好的選擇是創建一個代理視圖，該視圖生成當前您的 AJAX 請求，像 javascript 一樣處理結果，然后返回您試圖從 Django 模板系統獲取的任何內容。

然后，不要調用您當前正在進行的 AJAX 調用，而是調用您自己的視圖。 Django 在視圖中進行應有的處理，您可以對返回到 javascript 的內容進行細粒度控制，並且它仍然只是一個（客戶端）服務器調用。