我正在尝试向主题中的产品视图页面添加一些自定义标签。我能够看到内容,但jQuery没有生效。以下是详细信息,有人可以检查并建议是否需要做任何其他事情。
编辑:我使用的是magento 1.9.2.2
应用/设计/前端/ mytheme的/默认/模板/目录/产品/ view.phtml
<script type="text/javascript">
alert("YEs!");
$.noConflict();
$('ul.tabs').each(function(){
// For each set of tabs, we want to keep track of
// which tab is active and its associated content
var $active, $content, $links = $(this).find('a');
// If the location.hash matches one of the links, use that as the active tab.
// If no match is found, use the first link as the initial active tab.
$active = $($links.filter('[href="'+location.hash+'"]')[0] || $links[0]);
$active.addClass('active');
$content = $($active[0].hash);
// Hide the remaining content
$links.not($active).each(function () {
$(this.hash).hide();
});
// Bind the click event handler
$(this).on('click', 'a', function(e){
// Make the old tab inactive.
$active.removeClass('active');
$content.hide();
// Update the variables with the new link and content
$active = $(this);
$content = $(this.hash);
// Make the tab active.
$active.addClass('active');
$content.show();
// Prevent the anchor's default click action
e.preventDefault();
});
});
</script>
<div class="custom-nav">
<ul class="tabs">
<li><a href="#tab1">Description</a></li>
<li><a href="#tab2">Details</a></li>
<li><a href="#tab3">Reviews</a></li>
</ul>
<div class="custom-block-details" id="tab1">
<?php echo $_helper->productAttribute($_product, $_product->getName(), 'name') ?>
</div>
<div class="custom-block-details" id="tab2">
<h4><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?></h4>
</div>
<div class="custom-block-details" id="tab3">
<h4>Reviews</h4>
<?php echo $this->getReviewsSummaryHtml($_product, false, true)?>
</div>
</div>
应用/设计/前端/ mytheme的/默认/布局/ page.xml
<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>scriptaculous/effects.js</script></action>
<action method="addJs"><script>scriptaculous/dragdrop.js</script></action>
<action method="addJs"><script>scriptaculous/controls.js</script></action>
<action method="addJs"><script>scriptaculous/slider.js</script></action>
<action method="addJs"><script>varien/js.js</script></action>
<action method="addJs"><script>varien/form.js</script></action>
<action method="addJs"><script>varien/menu.js</script></action>
<action method="addJs"><script>mage/translate.js</script></action>
<action method="addJs"><script>mage/cookies.js</script></action>
<action method="addJs"><script>js/jquery-1.7.2.js</script></action>
<!--<action method="addJs"><script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script></action>-->
<!--<action method="addJs"><script>jsproductViewNavbar.js</script></action>-->
<block type="page/js_cookie" name="js_cookies" template="page/js/cookie.phtml"/>
<action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
<action method="addItem"><type>skin_css</type><name>css/styles-ie.css</name><params/><if>lt IE 8</if></action>
<action method="addCss"><stylesheet>css/widgets.css</stylesheet></action>
<action method="addCss"><stylesheet>css/print.css</stylesheet><params>media="print"</params></action>
<action method="addItem"><type>js</type><name>lib/ds-sleight.js</name><params/><if>lt IE 7</if></action>
<action method="addItem"><type>skin_js</type><name>js/ie6.js</name><params/><if>lt IE 7</if></action>
</block>
答案 0 :(得分:0)
使用$
的jQuery实例
像** jQuery.noConflict()**
并写下
jQuery.noConflict()
在view.phtml的jquery-1.7.2.js文件实例的底部 并且还会更改js文件的权限(读/写)