Question

我有自定义的javascript和jQuery代码。

我是magento的新手，需要知道如何将这些jquery和JS片段添加到我的magento中，以便识别出那些。

我试图在页面加载时显示工具提示，并在一段时间后使用下面的 JS小提琴链接隐藏：

小提琴使用以下文件：

1）jquery 2）bootstrap.js 3）bootstrap.css

因此我将我的magento文件更新为：

在 app \ design \ frontend \ rau \ default \ template \ page \ html \ pager.phtml

<?php if($followupbuttonshow){?>
    <div class="thiscategory">
        <a class="followlink" href="javascript:void" rel="tooltip" data-original-title="Place your stuff here"> <?php echo $this->__('Follow'); ?></a>  
    </div>
<?php } ?>

更新：

在 app \ design \ frontend \ rau \ default \ layout \ local.xml

<reference name="head">
      <action method="addJs"><js>jquery/jquery.js</js></action>
      <action method="addJs"><js>jquery/jquery.noconflict.js</js></action>
      <action method="addLinkRel"><rel>text/javascript</rel><href>https://netdna.bootstrapcdn.com/bootstrap/3.0.1/js/bootstrap.js</href></action>
      <action method="addLinkRel"><rel>text/css</rel><href>https://netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.css</href></action>
   </reference>
...

在 app \ design \ frontend \ rau \ default \ layout \ page.xml

<default translate="label" module="page">
   <action method="addJs"><script>js/custom.js</script></action>

在 rauqa \ skin \ frontend \ rau \ default \ js \ custom.js

jQuery(document).ready(function () {
    console.log('tooltipp js....');
    $j('.thiscategory .followlink').tooltip().eq(0).tooltip('show').tooltip('disable').one('mouseout', function() {
    $j(this).tooltip('enable');
    });

setTimeout(function() {
$j('.thiscategory .followlink').tooltip().eq(0).tooltip('hide').tooltip('enable');
}, 5000);

});

控制台错误：

tooltipp js ....

tooltip.js？q = 29032018：3未捕获TypeError：$ j（...）。tooltip不是函数

在HTMLDocument上。（？tooltip.js Q = 29032018：3）

在j（jquery.min.js？q = 29032018：2）

at Object.fireWith [as resolveWith]（jquery.min.js？q = 29032018：2）

在Function.ready（jquery.min.js？q = 29032018：2）

在HTMLDocument.J（jquery.min.js？q = 29032018：2）

要验证下面是否加载了js是屏幕截图：

加载了custom.js文件

jquery已加载 - 不确定这是否是实际的jquery文件

这是唯一加载的jquery

cdn for bootstrap.js和css loaded

链接到jquery：

问题：

不确定我是否以正确的方式正确包含了所有文件（html，xml）

请指出问题的位置..以及我必须包含magento脚本以识别的方式。

Answer 1

您只需将粘贴的script放入phtml文件即可。如果jquery未链接到页面，则链接它。另外，请注意jquery变量的命名。在许多情况下，其名称为$，但您在jQuery中将其用作script。

Answer 2

我相信您的JavaScript文件缺少关闭： );

编辑新错误：$是Magento中的Prototype，但您在代码中使用了jQuery。如果添加了jQuery，请使用分配给它的别名（例如$ j）。或者：

jQuery(document).ready(function(){
    console.log('tooltipp....');
    jQuery('.thiscategory .followlink').tooltip().eq(0).tooltip('show').tooltip('disable').one('mouseout', function() {
        jQuery(this).tooltip('enable');
    });

    setTimeout(function() {
        jQuery('.thiscategory .followlink').tooltip().eq(0).tooltip('hide').tooltip('enable');
    }, 5000);
});

如何在magento 1.8中包含自定义jQuery / javascript

2 个答案: