WordPress中的jQuery腳本

我在我的WordPress主頁上運行的WordPress頁面上使用jQuery UI滑塊。WordPress中的jQuery腳本

我需要爲了這個代碼塊爲我的輸入範圍內工作：

$(function() { 
    $("#slider-range").slider({ 
    range: true, 
    min: 0, 
    max: 500, 
    values: [ 75, 300 ], 
    slide: function(event, ui) { 
     $("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]); 
    } 
    }); 
    $("#amount") 
    .val("$" + $("#slider-range").slider("values", 0) + 
      " - $" + $("#slider-range").slider("values", 1) 
    ); 
});

但是，當我把它添加到我的header.php它阻止所有的JavaScript的網站。我在主頁上的滑塊無法工作等。那麼，我應該如何添加它而不會發生衝突？

來源

2016-03-02 Denin Korjenic

我改進了代碼的縮進。您應該養成適當縮進的習慣，因爲當它沒有縮進時，調試非常非常困難。 –

謝謝，我通常會跟蹤這一點，但我現在就趕快粘貼它。對不起。 –

你的控制檯錯誤是什麼？ – rnevius

根據您的意見，它聽起來像是一些腳本的依賴關係丟失。也就是說，腳本假設某些變量是在運行時定義的，而不是。 jQuery需要首先出現，然後（至少）你正在使用的jQuery UI庫。所以你需要確保你的腳本只在這些腳本之後被添加到頁面中。

你用PHP來做到這一點，用wp_enqueue_script()。這個函數處理你的js文件添加到頁面，無論是在標題或（默認）頁腳。這個函數的一個參數是一個依賴關係數組，所以在這裏你可以傳遞'jquery'，'jquery-ui'和'jquery-ui-slider'。（這些是'註冊'，WordPress通過這些註冊來註冊每個腳本 - 在上面鏈接的頁面上有一個WP知道的腳本列表。）只要您正確指定了所有的依賴關係，那麼您當前正在獲取的錯誤應該消失。

來源

2016-03-02 22:49:44

我會建議添加WordPress插件Scripts n Styles。它允許您在全局級別或頁面級別包含專門的JavaScript。它會爲您提供更大的靈活性，在未來，如果你使用類似：

window.jQuery(document).ready(function ($) { 
    ... 
});

哪裏...包含你的邏輯在網頁加載執行，您不應該以任何衝突運行英寸

來源

2016-03-03 01:55:06 GONeale

WordPress中的jQuery腳本

回答

相關問題