JQuery兼容性和WordPress

我購買的HTML主題的基於JQuery的代碼是指帶有簡寫的JQuery對象，即$。JQuery兼容性和WordPress

但是，WordPress使用Jquery對象作爲JQuery - 出於兼容性原因。

我想堅持WordPress的做法，並改變主題的代碼與WordPress兼容。

有沒有辦法將該主題的JavaScript代碼與JQuery對象一起使用？爲了更具體一些，我會給你一個例子;

考慮下面的JavaScript代碼使用一些JQuery的魔法

/* __________________ Equal Heights __________________*/ 
$.fn.eqHeights=function(a){var f={child:false};var a=$.extend(f,a);var d=$(this);if(d.length>0&&!d.data("eqHeights")){$(window).bind("resize.eqHeights",function(){d.eqHeights()});d.data("eqHeights",true)}if(a.child&&a.child.length>0){var c=$(a.child,this)}else{var c=$(this).children()}var g=0;var b=0;var e=[];c.height("auto").each(function(){var h=this.offsetTop;if(g>0&&g!=h){$(e).height(b);b=$(this).height();e=[]}b=Math.max(b,$(this).height());g=this.offsetTop;e.push(this)});$(e).height(b)};

也可以考慮以下的init以該節放在這需要的Equal Height Columns照顧。

/* ________ equal heights __________________*/ 

$(document).ready(function() { 
    $('.equalHeights').eqHeights(); 
});

現在......我該怎麼做才能讓上面的代碼與WordPress兼容？

我知道我要插入一些關鍵的地方（一個或多個）的JQuery串以上的地方，但不知道究竟在何處..

該手抄本網頁（下面的鏈接）是一個很好的資源，但是，我仍然不能弄清楚是如何完成的。

http://codex.wordpress.org/Function_Reference/wp_enqueue_script#jQuery_noConflict_Wrappers

實際代碼爲http://bombdiggitydesign.com/crisp-2/Crisp-warm/hero-equal-height-columns.html是這裏http://bombdiggitydesign.com/crisp-2/Crisp-warm/assets/js/custom.js（只搜索EqualHeights）。

我剛剛複製了上面的一小段文字，以表達我的觀點，而不是讓你處理她巨大的custom.js。我認爲我抓住的部分足以理解這是如何完成的。如果你想「$」總訪問「jQuery的」，而無需在代碼的其餘部分更換

來源

2013-10-15 Average Joe

，把這個在那裏：

JQuery(document).ready(function($) { 
    // Inside of this function, $() will work as an alias for jQuery() 
    // and other libraries also using $ will not be accessible under this shortcut 
});

來源

2013-10-15 22:46:38

謝謝你的回答。我仍然得到一個'Uncaught TypeError：無法讀取chrome開發人員工具中未定義錯誤的屬性'fn'。安慰。錯誤在這一行。 '/ * __________________平等的高度__________________ */ $ .fn.eqHeights = function（a）{var f = {c ....' –

could this http://stackoverflow.com/questions/10807430/jquery-uncaught- typeerror-can not-read-property-fn-unde-undefined-anonymous-fun是一種補救措施，以避免我收到的錯誤？ - 如果是這樣的話，這個包裝會去哪裏？ –

我提供的鏈接有解決方案。我會回答我自己的問題。感謝您的幫助。 –

回答這個問題是在下面的計算器網址：

jQuery Uncaught TypeError: Cannot read property 'fn' of undefined (anonymous function)

但把它帶回家，這裏是我需要做的：

包裹在這樣的custom.js主代碼;

(function ($) { 

    // all that $ based code goes here... 

}(jQuery));

換句話說，

轉到custom.js文件（其位於http://bombdiggitydesign.com/crisp-2/Crisp-warm/assets/js/custom.js），並且這添加到頂部

(function ($) {

和這對底

}(jQuery));

並保存該文件。不需要額外的工作。

這是一個整體的解決方案，只有兩行代碼，你不僅照顧我所指的EqualHeights部分，而且整個She-Bang的其餘部分。他們現在都與WordPress兼容。

希望它可以幫助別人。 - 我肯定會這樣做。

來源

2013-10-15 23:35:07

在我的情況下，問題是與最新版本的jQuery不兼容。這主題functions.php添加作爲暫時的解決辦法，直到插件是固定的：

function thethe_fix() { 
    wp_deregister_script('jquery'); 
    wp_enqueue_script("jquery", 
     "//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js", array('json2'), 
     '1.8.3'); 
} 
add_action('wp_print_scripts', 'thethe_fix', 20);

注意，這將解決您的網站上的jQuery，這可能不是一件好事長期的1.8.3版本。

來源

2014-04-08 01:10:25

JQuery兼容性和WordPress

回答

相關問題