WordPress中的jQuery库不起作用的相关问题
WordPress 中的jQuery 库问题曾经困扰了我一段时间。如果仅仅加载WordPress 自带的jQuery 库,在使用一些jQuery 插件的时候明明是代码没有错误,但就是不起作用,该有的效果不能实现;但加载了原版的jQuery 库却又可以了,这样一来却同时加载了两个jQuery 库,网页速度拖慢了而且根本没有必要。
后来才了解到:为了防止与其他 JS 库(如 YUI)冲突,WordPress 内置 jQuery 库的末尾都在原版的基础上加入了 jQuery.noConflict()
这个东东,以至于在jQuery 代码中用$ 代替jQuery 的写法不能识别,一些功能不起作用的原因正是由此而来。
如何解决这个问题,网络上有以下解决方案:
方案一:将相关js代码中的$ 手动改为 jQuery。
比如原来的代码是:
$(document).ready(function(){ $("p").after("<b>Hello</b>"); }); |
---|
需要改为:
jQuery(document).ready(function(){ jQuery("p").after("<b>Hello</b>"); }); |
---|
方案二:不加载WordPress自带的jQuery 库,改用官方或者第三方的jQuery 库。
貌似WordPress 默认是加载自带的jQuery 库的,首先你要取消这个功能,使之在前台默认不加载自带的jQuery 库:
打开/wp-includes/script-loader.php文件,以“jquery.js”为关键词查找,在第127行能找到这么一句(以WordPress 3.5.1为例):
$scripts->add( 'jquery', '/wp-includes/js/jquery/jquery.js', array(), '1.8.3' ); |
---|
替换为:
if(is_admin()){$scripts->add( 'jquery', '/wp-includes/js/jquery/jquery.js', false, '1.8.3' );} |
---|
因为在后台必须得用到这个库,只能加个判断,让其只在后台下运行。
更新:如果查看源代码分享加载了WordPress 自带的jquery 库,那么肯定是主题或者插件加载的(非登录状态下),因此,按照下面的代码可予以取消(其实就开发而言,不建议这么做):
你的主题也可能加载也会加载WordPress 自带的jQuery 库。如果你想取消,就需要在主题文件中找到如下关键代码,删除或注销之:
wp_enqueue_script('jquery'); |
---|
当然,既然主题自动加载了,那肯定是有它的用处,如果删除了,一些主题功能可能会失效。
接下来就是改用官方或者第三方的jQuery 库,请直接参考:
《为你的WordPress 选择最佳的第三方jQuery 库》
我的话是两个都用上。
参考WordPress官方文档:zh-cn:函数参考/wp enqueue script
相关知识:jQuery 与Javascript 的关系 jQuery 是一个 JavaScript 函数库。jquery 对javascript进行扩展,封装,让javascript更好用,更简单。看过一个比喻:如果说JavaScript 是面条,那么jQuery 就是方便面——自己好好理解吧~
- .NET Core 实现定时抓取博客园首页文章信息并发送到邮箱
- 基于 R 语言和 SPSS 的决策树算法介绍及应用
- Android 8.0 中的安全增强功能
- python2 群发 html 或文本邮件
- windows 安装 storm 及 eclipse 调试 TopN 实例
- shell 学习笔记(16)
- 根据ip查找ISP运营商和归属地的几种方法
- windows 安装 spark 及 pycharm 调试 TopN 实例
- storm kafka 编程指南
- 基于Session的身份窃取
- 使用 django-blog-zinnia 搭建个人博客
- 针对提权小神器Sherlock的分析与利用
- 关于 rsync 中: 和 :: 及 rysnc 和 ssh 认证协议的区别
- Java 反射机制详解
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- httprunner学习27-参数关联时在 yaml 文件 int 和 str 数据类型转换
- python笔记47-面试题:如何判断字典a在字典b
- Go操作腾讯云COS对象存储的简单使用案例
- Go channel 实现原理分析
- Web压测工具之Webbench和http_load
- 这 6 个 Spring Boot 项目够经典
- 自动化测试框架
- Go 并发控制
- Rsync服务简介部署使用及原理详解
- Go之context包的分析
- Repulsion Loss 遮挡场景下的目标检测
- Selenium4 IDE新特性:弹性测试、循环和逻辑判断
- Go 字符串处理
- Golang 特殊类型
- IntelliJ中基于文本的HTTP客户端