我正在使用 cakephp 2.9.9,我想使用一个简单的 jquery 函数并包含在 default.ctp 中,但它没有按预期工作。详情如下:
1.我已经下载了JQuery库jquery-3.2.1.js,我的javascript文件名为script.js,我把这两个文件放在/app/webroot/js文件夹中。
2.在我的 default.ctp 文件中,我添加了以下几行 -
echo $this->Html->script('jquery-3.2.1');
echo $this->Html->script('script');
echo $scripts_for_layout;
3.我想根据当前事件链接更改导航菜单的样式。我的 script.js 文件如下 -
(function(){
console.log(1); //this can be seen on console
$("#nav a").on("click", function(e){
console.log(2); // this cannot be seen on console
$("#nav a").removeClass('active');
$(e.currentTarget).addClass('active');
});
})();
4.当我打开我的页面时,页面调用脚本文件(因为 1 在控制台上执行)但它没有调用 jquery 的 .on() 函数。知道为什么会这样吗?
最佳答案
可能是以下原因造成的:
- 检查您是否在使用它的脚本之前添加了 jQuery。反而
console.log(1)
尝试在控制台输出console.log($)
并确保已加载 Jquery。 - 通常使用 JQuery,我们将代码放在
ready()
函数中,例如$(document).ready(function() {//code goes here });
- 检查页面上确实存在选择器
#nav a
。 也许它应该是nav a
? - 如果您在脚本标签上使用诸如
async/defer
之类的东西,请确保 您使用defer
(它保留脚本的顺序)或 全部删除并同步加载脚本。 - 这是一个相当愚蠢的建议,但你真的点击了吗
链接?因为你写“它没有调用 .on() 函数
jquery”。顺便说一句,你不会阻止默认行为(在
至少在你分享的那段代码中),所以即使一切正常
使用 Jquery 和您的代码,将加载一个新页面,您将
看不到当前页面上链接的样式已更改。你有
在点击处理程序中使用
e.preventDefault()
- 请注意,在这种情况下,您将应用代码,但默认情况下不会加载新页面 -e.preventDefault()
取消它。相反,您必须通过 AJAX 加载新内容或将链接保存到变量中并在新/当前选项卡中使用 JS 打开新页面,如document.location.assign = "link-to-a-new-page"
稍后。
很难说更多,因为您只分享了一小部分代码。
关于javascript 函数在 cakephp 2 中无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45499048/