添加自定义 Jquery 文件到 joomla 3

Question

我正在尝试将自定义 jquery 文件添加到 joomla!。我已将以下内容添加到 templates/theme/index.php 中

之前

    <?php
$document = JFactory::getDocument();
$document->addScript('templates/theme1982/js/add.js');
?>

  <jdoc:include type="head" />

以下 jquery 是我正在测试以解决此问题的内容：

$(document).ready(function(){
    $('#ppp').click(function(event) {
      $("#ppp").toggleClass("mmm");
    }); 
});

与html:

<div id="ppp">f</div>

和CSS：

.mmm {
    transform:rotate(45deg);
    background: green;
    }
    #ppp {
    width:200px;
    height:200px;
    background: pink;   
        }

add.js 文件似乎出现在 google 源代码视图中，文件中有 jquery 文本，但该功能不起作用

Answer 1

Joomla 在无冲突模式下加载 jquery。

您必须将代码更改为：

jQuery(document).ready(function(){
   jQuery('#ppp').click(function(event) {
     jQuery("#ppp").toggleClass("mmm");
   }); 
});

Add custom Jquery file to joomla 3