jQuery與Joomla的衝突YooTheme WidgetKit

Question

我正在爲當地的客戶開發一個Joomla網站。

我有一個jQuery衝突正在做我的頭！

我從YooTheme運行此模板： http://www.yootheme.com/demo/themes/joomla/2013/infinite/

頂部幻燈片jQuery的控制。它由YooThemes「WidgetKit」運行。

我有一個簡單的聯繫表單，使用jQuery驗證（電子郵件地址等）。

當我將聯繫表單放到網站上時，頂部幻燈片會消失。

這是jQuery代碼：我的

<script src="********/js/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function() { 
jQuery.noConflict(); 

function isInt(n) { 
return typeof n === 'number' && n % 1 == 0; 
} 

// Form validation 
jQuery(".darkBtn").click(function(e) { 
e.preventDefault(); 
var email_check = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/i; 
var email = jQuery("form.form_contact .email").val(); 

var zipCheck = /[A-Z]{1,2}[0-9R][0-9A-Z]? [0-9][ABD-HJLNP-UW-Z]{2}/i; 
var zip = jQuery("form.form_contact .zipcode").val(); 

var phoneCheck = /^\d+$/; 
var phone = jQuery("form.form_contact .phone").val(); 

var error = ""; 

if(!email_check.test(email)) 
{ 
error = "Please give a valid email address." 

} 

if(!zipCheck.test(zip)) 
{ 
error = "Please give a valid postcode."; 
} 

if(!phoneCheck.test(phone) || phone.length != 11) 
{ 
error = "Please give a valid phone number."; 
} 


// No error ? -> Submit 
if(error == "") 
{ 
jQuery(".form_error").hide(); 
jQuery("form#contact_form").submit(); 
} else { 
jQuery(".form_error").empty().text(error); 
jQuery(".form_error").show(); 
} 
}); 
}); 

</script> 

朋友誰知道很基本的jQuery被撞這件事對我來說。但是，他並不知情解決問題。談到jQuery，我不知道。

我做了一些閱讀和地方找到它說，嘗試在這就是爲什麼它有「jQuery的」，而不是「$」符號的代碼改變「$」到「jQuery的」。

我怎樣才能讓這兩個一起工作？ 任何幫助表示讚賞。

新代碼如下意見中的要求：包括jQuery庫到頁面後直接

<script src="********/js/$.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$.noConflict(); 
$(document).ready(function($) { 


function isInt(n) { 
return typeof n === 'number' && n % 1 == 0; 
} 

// Form validation 
$(".darkBtn").click(function(e) { 
e.preventDefault(); 
var email_check = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/i; 
var email = $("form.form_contact .email").val(); 

var zipCheck = /[A-Z]{1,2}[0-9R][0-9A-Z]? [0-9][ABD-HJLNP-UW-Z]{2}/i; 
var zip = $("form.form_contact .zipcode").val(); 

var phoneCheck = /^\d+$/; 
var phone = $("form.form_contact .phone").val(); 

var error = ""; 

if(!email_check.test(email)) 
{ 
error = "Please give a valid email address." 

} 

if(!zipCheck.test(zip)) 
{ 
error = "Please give a valid postcode."; 
} 

if(!phoneCheck.test(phone) || phone.length != 11) 
{ 
error = "Please give a valid phone number."; 
} 


// No error ? -> Submit 
if(error == "") 
{ 
$(".form_error").hide(); 
$("form#contact_form").submit(); 
} else { 
$(".form_error").empty().text(error); 
$(".form_error").show(); 
} 
}); 
}); 

</script> 

Answer 1

呼叫jQuery.noConflict();。這是因爲一些圖書館也試圖使用$符號並與jQuery衝突。這在全球範圍內將其交給他們。

您仍然可以在您的jQuery代碼中使用$，只需在(function($){ ... })(jQuery)之前確保它完全位於函數的作用域內（因此它不會影響其他庫）。

jQuery.noConflict(); 
jQuery(document).ready(function($) { 
    ... Your jQuery code here 
} 

編輯：當你包括jQuery的多次到同一個頁面（因爲是OP的情況下），可能會發生同樣的情況。