Magento hiển thị xung đột jQuery với nhau

Question

Tôi là những người mới đến Magento. Tôi đã sử dụng banner rotaor script để hiển thị biểu ngữ. Vì tôi phải hiển thị biểu ngữ ở mọi trang, đó là lý do tại sao tôi đã triển khai thanh trượt trong tệp header.phtml để tôi có thể hiển thị biểu ngữ trong mỗi trang. Vì vậy, trong header.phtml đang trượt của tôi là một cái gì đó như thế này

<script language="javascript"> 
     jQuery.noConflict(); 
     jQuery(document).ready(function(){ 
      bannerRotator('#bannerRotator', 500, 5000, true); 
     }); 
     </script> 
<div id="bannerRotator"> 
    <?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('homepageslider')->toHtml(); ?> 
</div> 

đây thanh trượt được làm việc tốt nhưng khi tôi nhìn các console tab trong firefox Tôi có một số errors.Here là hình ảnh cho lỗi giao diện điều khiển tab. Để giải quyết tất cả các vấn đề tôi googled và đến để biết rằng jQuery là mâu thuẫn. Vì vậy, để rõ ràng rằng tôi đã sử dụng jQuery.noConflict và cũng đã xóa tất cả $ thành jQuery. Nhưng tôi vẫn gặp vấn đề tương tự. Bất kỳ trợ giúp và đề xuất nào sẽ thực sự đáng được đánh giá cao. Cảm ơn

Sống trang web có thể được tìm thấy here

Answer 1

Bạn phải thêm jQuery.noConflict(); đến cuối tập tin jquery.js kịch bản của bạn và không bên ngoài của nó như là nó phải được gọi trước khi prototype.js kịch bản được đưa vào.

Answer 2

Bao gồm jquery.noConflict trong tệp app/design/frontend/default/[tên chủ đề] /template/page/html/head.phtml.

Bạn muốn thêm quyền này sau khi bạn bao gồm jquery, và ngay trước khi getCssJsHtml()

tôi đã đi một bước xa hơn trong việc thực hiện của tôi và gọi nó vào một $ j var, nhưng bạn có thể làm điều đó, hoặc chỉ thực hiện jquery.noConflict();

Nếu bạn sử dụng một var $ j, thì tất cả các cuộc gọi jQuery của bạn sẽ được với đối tượng đó.

Tôi đã làm điều này:

!-- adding jQuery --> 
<script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
//<![CDATA[ 
    var $j = jQuery.noConflict(); 
//]]> 
</script> 
<!-- ************* --> 

<?php echo $this->getCssJsHtml() ?> 

trong header.phtml của bạn, bạn sẽ cần phải gọi thanh trượt của bạn như thế này:

<script language="javascript"> 
$j(document).ready(function(){ 
      bannerRotator('#bannerRotator', 500, 5000, true); 
     }); 
</script> 

Answer 3

Bạn có thể sử dụng Magento này Module: https://github.com/sotastudio/Mage.Ext.Jquery

Nó chỉ cần tổ chức lại việc bao gồm các công cụ JavaScript và đặt jQuery trực tiếp đến vị trí đầu tiên. Ngoài ra, bạn có thể dễ dàng kích hoạt nội dung jQuery trong đoạn mã này:

(function($) { 
    $(function() { 
    //console.log($('body')); 
    }); 
})(jQuery); 

Answer 4

Bạn có hai vấn đề.

1)

Bạn đã bao gồm jQuery hai lần. Bạn có jquery.js (1.7.1) đi kèm, và cả jquery-1.4.4.min.js cũng được thêm vào. Điều này đang gây ra sự cố đang được xem.

Tìm kiếm dự án cho chuỗi 'jquery-1.4.4.min.js' và có thể bạn sẽ tìm thấy một exntry bên trong một tập tin cấu hình XML, hãy thử cho ý kiến ​​này ra ..

Có thể hai mô-đun được cả hai thêm jquery thông qua cấu hình XML của Magento. Xóa một trong các mục nhập này bên trong tệp cấu hình XML mô-đun và các sự cố sẽ biến mất. Tôi sẽ khuyên bạn nên loại bỏ jquery-1.4.4.min.js vì điều này được bao gồm sau khi hầu hết các plugin jquery khác sẽ gây ra nhiều vấn đề hơn.

2)

jQuery.noConflict() được gọi sau khi jquery đã được sử dụng. Như đã đề xuất ở trên, cách tốt nhất để nhận arounf này là mở tệp jquery.js của bạn và thêm tệp này vào cuối tệp: ; jQuery.noConflict();

Answer 5

Cách tốt nhất để có được xung quanh mâu thuẫn trong kinh nghiệm của tôi là như sau:

• Remove 1 phiên bản của jQuery - bạn có 2 cài đặt. Thông thường, mới nhất phải tương thích với tất cả các plugin của bạn.
• Chỉnh sửa tập tin jQuery của bạn và thực hiện, ví dụ: jquery-1.7.1-custom.js
  • thêm jQuery.noConflict(); vào cuối của tập tin.
• Những gì bạn đang làm là chính xác - không sử dụng ký hiệu $, chỉ cần sử dụng tiền tố jQuery jQuery cho mọi thứ.
• Điều quan trọng nhất trong trường hợp của bạn. Hãy chắc chắn rằng các file của bạn được nạp theo thứ tự này:
  • Prototype
  • jQuery (tùy chỉnh)
  • jQuery plugin

Answer 6

Bạn Vấn đề chính là bạn đang kể jquery trước khi nguyên mẫu (xem nguồn trang)

<script type="text/javascript" src="..../js/jquery/jquery.js"></script> 
<script type="text/javascript" src="..../js/prototype/prototype.js"></script> 

Bạn cần thay đổi thành

<script type="text/javascript" src=".../js/prototype/prototype.js"></script> 
<script type="text/javascript" src=".../js/jquery/jquery.js"></script> 
//best to add jQuery noConflict right after 

Để cố định mở

/design/frontend/default/[theme]/layout/page.xml này

hoặc (nếu jquery không tìm thấy trong phần trên)

/app/design/frontend/default/[theme]/template/page/html/head.phtml

page.xml của bạn sẽ trông như thế

<default translate="label" module="page"> 
    ...... 
     <block type="page/html_head" name="head" as="head"> 
      <action method="addJs"><script>prototype/prototype.js</script></action> 
      <action method="addJs"><script>lib/ccard.js</script></action> 
      <action method="addJs"><script>prototype/validation.js</script></action> 
      <action method="addJs"><script>scriptaculous/builder.js</script></action> 
      ...... 
      <action method="addJs"><script>mage/translate.js</script></action> 
      <action method="addJs"><script>mage/cookies.js</script></action> 


      <action method="addItem"><type>skin_js</type><name>js/jquery-1.7.2.min.js</name></action> 
      <action method="addItem"><type>skin_js</type><name>js/jquery.noconflict.js</name></action> 
      <action method="addItem"><type>skin_js</type><name>js/jqforms/jquery.jqtransform.js</name></action> 
      <!- all other jquery plugin below --> 
    ..... 

Tạo một jquery.noconflict gọi tập tin.js và thêm

var $j = jQuery.noConflict(); // you could also add this to the end of jquery-1.7.2.min.js 

Trong mã jquery tùy chỉnh của bạn, bạn KHÔNG THỂ sử dụng $... nữa (sử dụng bởi chỉ PrototypeJS), bạn cần phải sử dụng một trong hai $j... hoặc jQuery...

Sau đó loại bỏ

<script src="http://modulesoft.biz:/projects/magento/extream/skin/frontend/base/default/js/jquery-1.4.4.min.js"></script>