一千萬個為什麽

搜索

使用AJAX進行導航

我沒有經常使用AJAX,但我想做的是以下內容:

我有一個頂部導航,輸出結構中的條目,該結構鏈接到顯示我的數據的各種單曲。 我希望我的導航保留,而不是在轉到另一頁時重新加載。我將如何實現AJAX與Craft相結合?

最佳答案

除了James Muspratt的出色回答之外,我想我可能會分享一些我學到的其他技巧。在頁面模板中,您可以使用條件來根據其是否為ajax請求來修改行為。通過這種方式,您可以將模板設計為既可以作為Ajax請求也可以作為直接請求,這對SEO和其他用途非常有用。

例如,使用ajax加載模板的一個問題是,如果模板還沒有設計為加載頭,css,js,nav等,則實時預覽可能無法在CP中工作。解決此問題的一種方法是擴展基於不同的模板關於請求的類型:

{% extends craft.request.isAjax and not craft.request.isLivePreview ? "_ajax" : "_layout" %}

正如你所看到的,如果它是ajax我正在擴展一個只有內容塊定義的模板;並且它不是ajax然後我將使用head,js,css,nav等擴展完整模板。捕獲的是Live Preview也使用ajax,因此無論如何我們想要完整的模板。

您也可以使用相同的方法返回略微修改的內容。在這種情況下,我只是為ajax請求加載原始_product模板,並根據非ajax的需要包裝它:

{% block content %}

{% if craft.request.isAjax and not craft.request.isLivePreview %}

    {# return the raw _product template #}
    {% include 'products/_product.html' %}

{% else %}

    {# return the modified _product template wrapped properly for the full page layout #}
    
<div class="content"> {% include 'products/_product.html' %} </div>
 

{% endif %}

{% endblock %}

希望這會有所幫助,並且不會讓事情變得更加混亂。

轉載註明原文: 使用AJAX進行導航