Magento 静态块和 jQuery Accordion 不能一起工作答案

【问题标题】：Magento Static Block and jQuery Accordion Not Working TogetherMagento 静态块和 jQuery Accordion 不能一起工作
【发布时间】：2014-10-13 20:55:04
【问题描述】：

我正在使用 Magento 的 Responsive Banner Slider 扩展程序在我的主页上查看 jQuery Accordion 上方 - 但是脚本似乎相互竞争。第一个选项卡扩展了横幅中第一张幻灯片的长度。以下是我的代码：

     <head>
        <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/start/jquery-ui.css">
        <script src="//code.jquery.com/jquery-1.10.2.js"></script>
        <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
        <link rel="stylesheet" href="/resources/demos/style.css">
        <script>
        $(function() {
        $( "#accordion" ).accordion({
        collapsible: true,
        active: false,
        heightStyle: "content"    
        });
        });
       </script>
       </head>

       {{block type="responsivebannerslider/index" name="responsivebannerslider_index" template="responsivebannerslider/index.phtml"}}

<div id="accordion">

  <h3>CONVENIENCE STORE INDUSTRY</h3>
  <div>
    <h4>FROM BLAND TO BRAND - A CHANGING INDUSTRY</h4>
    <p>
<p>Until recent years, branding was not a core focus to c-store owners. You could survive by being the quick, in and out shopping experience and by stocking the quintessential “variety store” items that every customer relied on you to sell.</p>
<p>Today, a growing swath of the c-store industry is disrupting this model by offering and becoming MORE to the consumer. These operators have mastered the basics and now expanded their offerings with well-designed decors and higher quality food service. Their success is drawing more customers into the stores thus becoming an essential part of their customers’ daily commute.</p>
<h4>MAKE YOUR STORE “POP”!</h4>
<p>At The Morrison Group, our goal is to help you make your store more than an impromptu stop – but a frequented destination. We use our experience and expertise from 25 years in the coffee & fountain business to brand your program and make you unique from your competition through the following:</p>
<ul>
<li><strong>Disposable items – branded walking advertisements for your store</strong></li>
<ul>
<li>Hot / cold cups</li>
<li>Mugs / bags / napkins</li>
<li>Foodservice packaging</li>
</ul>
<li><strong>Custom POP/POS – taking customers from pump to purchase</strong></li>
<ul>
<li>In-house creative services</li>
<li>Full production department</li>
<li>Indoor / outdoor signage</li>
<li>Wall graphics</li>
</ul>
</ul>
<h4>Dealers (1-10 stores)</h4>
<ul>
<li>Customized hot / cold cup program (minimums as low as 10,000)</li>
<li>Morrison designed stock cups and mugs (no minimums)</li>
<li>Exclusive national oil branded products (no minimums)</li>
</ul>
<h4>Dealers (11-300+ stores)</h4>
<ul>
<li>Customized hot / cold cup programs wide selection of substrates at low cost</li>
<li>Fully designed POP systems by in-house creative department</li>
<li>Warehousing and national distribution capability from a single case to full truckload</li>
</ul>
<h4>Jobbers / Petroleum Marketers</h4>
<h5>COST EFFECTIVE STRATEGIES FOR OIL OR CUSTOM BRANDS</h5>
<p>We can partner with you to provide your stores the best possible cost on disposable packaging items and branded décor options (e.g. monthly marketing kits). Through scaled purchasing power you can help your operator’s bottom line and keep them ahead of the competition.</p>
<ul>
<li>Customized beverage program</li>
<li>Stock and exclusive oil branded products</li>
<li>Low-to-no minimum runs (less frequent restocking)</li>
<li>Warehousing and national distribution capability from a single case to full truckload</li>
</ul>
</p>
  </div>

  <h3>WHOLESALERS</h3>
  <div>
    <h4>SOLUTIONS THAT MAKE SENSE</h4>
<p>Efficiently carrying your customers’ proprietary branded items is a major challenge in the wholesale industry. While every wholesaler works tirelessly to keep its customers happy, warehousing high minimum runs of custom branded products inflates inventories and increases working capital. At The Morrison Group, we offer beverage program solutions that take the stocking head-ache out of the purchasing department’s hands and allow the wholesaler to provide better options for its customers. Our low-minimum runs and flexible shipping allow you to only bring in quantities that make sense.</p>
<p>Oh, and the dilemma of figuring out which lid goes on which cup? Give us a call – we are experts and can handle these questions any time. Pair up with The Morrison Group and ensure hot and cold cups are part of every store delivery.</p>
<strong>How we help wholesalers:</strong>
<ul>
<li>Flexible distribution and shipping</li>
<li>Broadest custom cup program in the industry</li>
<li>In-house creative department with branding expertise</li>
<li>Cup/Lid experts and ready to assist your sales staff out in the field</li>
</ul>
  </div>

  <h3>COFFEE ROASTERS</h3>
  <div>
    <h4>THE PERFECT BLEND TO SUPPORT YOUR BRANDED PROGRAM</h4>
<p>As a coffee roaster, you have spent years perfecting the art of roasting a gourmet cup of coffee. From scouring the world for the best selection of beans, to choosing the perfect tasting process, you are involved in every step of creating that perfect cup of Joe. At The Morrison Group, we are committed to the coffee business. We develop, implement and produce branded materials and cups to support your coffee and fountain programs.  Choosing a partnership with TMG is the perfect blend of creative collaboration and support that will enhance the drinking experience of your customers.</p>
<strong>The Morrison Group has a strong track record assisting in the POP management of these major brands:</strong>
<ul>
<li>Smucker’s – (Folgers, Millstone, Java Coast, Cafe Bustelo)</li>
<li>New England Coffee</li>
<li>S&D Coffee</li>
<li>Eight O’clock Coffee</li>
<li>Conoco Phillips</li>
<li>76</li>
<li>Valero</li>
<li>BP</li>
<li>Shell</li>
<li>Chevron</li>
<li>Core-Mark (Arcadia Bay)</li>
<li>McLane (Cup Program)</li>
</ul>
<strong>How we help roasters:</strong>
<ul>
<li>In-house creative department with branding expertise</li>
<li>Years of market research concerning cup material specifications and regional consumer preferences</li>
<li>Fully designed POP systems</li>
<li>Low-to-no minimums for niche shops</li>
</ul>
</div>

  <h3>FOODSERVICE</h3>
  <div>
    <h4>PROGRAMS THAT WILL MAKE THEM HUNGRY</h4>
    <ul>
    <li>Cafe</li>
    <li>Restaurant</li>
    </ul>
  </div>

  <h3>ADVERTISING AGENCY</h3>
  <div>
    <h4>ADD EXPERTISE AND VALUE TO YOUR CREATIVE OFFERINGS</h4>
<p>When it comes to producing successful campaigns, design, practical components and a focused marketing strategy are all essential. A partnership with TMG brings value, solutions and added expertise to your creative offerings for your clients. It takes a broad mix of media and graphic applications to accomplish the unique goals of a business—whether it’s branding, driving sales, new product awareness or simply aesthetics, combining talent and resources will bring results that not only meet, but exceed your clients expectations.</p>
  </div>

</div>

【问题讨论】：

Magneto 默认使用原型，因此会发生冲突。在调用 Jquery 之后，您必须使用 <script>jQuery.noConflict();</script>。那么你所有的 $ 都应该被替换为 jQuery ex - $(function() { 应该是 jQuery(function() {
我添加了您的建议，它完全剥离了 jQuery，因此所有内容都在页面上显示为常规 HTML。但是，横幅不再隐藏。
@Dharam 这是代码：<head> <meta charset="utf-8"> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/start/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> jQuery(function() { jQuery( "#accordion" ).accordion({ collapsible: true, active: false, heightStyle: "content" }); }); </script> <script>jQuery.noConflict();</script> </head>
noConflict 应该在您的代码顶部和 jQuery 调用之下。你的代码应该是<head> <meta charset="utf-8"> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/start/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script><script>jQuery.noConflict();</script> <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> jQuery(function() { jQuery( "#accordion" ).accordion({ collapsible: true, active: false, heightStyle: "content" }); }); </script> </head>
@Dharam 我按照你的建议做了，没有任何改变。 jQuery 仍然从内容中剥离。

标签： jquery magento magento-1.9

【解决方案1】：

当您说“剥离”时，您是说 jQuery 脚本消失了吗？如果是这样，您可能正在尝试使用 Magento WYSIWYG 插入此代码。不要那样做；如果你逃得不好，它会吃掉代码。

有一些扩展可以防止这种情况发生，但我们发现没有一个是可靠的。

最好的方法是尝试在您的脚本代码中添加注释标签，看看是否成立：

<script type="text/javascript">
  //<![CDATA[
  code goes here
 //]]>
</script>

【讨论】：