遇到问题情境:

由于Layui部分内置模块依赖jQuery,所以没有单独引入jQuery,但是在使用$常规写法获取dom元素时,提示未定义

出现问题的原因:

由于Layui部分内置模块依赖jQuery,所以我们将jQuery1.11最稳定的一个版本作为一个内置的DOM模块(唯一的一个第三方模块)。只有你所使用的模块有依赖到它,它才会加载,并且如果你的页面已经script引入了jquery,它并不会重复加载。内置的jquery模块去除了全局的$和jQuery,是一个符合layui规范的标准模块。

两种解决方法:

//第一种:主动加载jquery模块
layui.use(['jquery', 'layer'], function(){
var $ = layui.$ //重点处
,layer = layui.layer; //后面就跟你平时使用jQuery一样
$('body').append('hello jquery');
}); //第二种:如果内置的模块本身是依赖jquery,你无需去use jquery,所以上面的写法其实可以是:
layui.use('layer', function(){
var $ = layui.$ //由于layer弹层依赖jQuery,所以可以直接得到
,layer = layui.layer; //……
});

write by:tuantuan

layui如何使用内部jQuery?的更多相关文章

  1. Layui 的内置jquery 版本

    //layui-v2.4.5 的内置jquery 版本. console.log(layui.$.fn.jquery);//=> 1.12.3 可以使用内置jq的方法: 方法一: layui.u ...

  2. layui和jquery冲突:Syntax error, unrecognized expression: +

    问题 layui创建table数据表格,但点击第二页时控制台报错,错误信息如下: 解决方法 https://fly.layui.com/jie/24224/ http://www.layui.com/ ...

  3. layui 的基本使用介绍

    全局配置 layui.config({ dir: '/res/layui/' //layui.js 所在路径(注意,如果是script单独引入layui.js,无需设定该参数.),一般情况下可以无视 ...

  4. 【深入浅出jQuery】源码浅析--整体架构

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...

  5. jQuery 2.0.3 源码分析 Deferred(最细的实现剖析,带图)

    Deferred的概念请看第一篇 http://www.cnblogs.com/aaronjs/p/3348569.html ******************构建Deferred对象时候的流程图* ...

  6. 解密jQuery事件核心 - 绑定设计(一)

    说起jQuery的事件,不得不提一下Dean Edwards大神 addEvent库,很多流行的类库的基本思想从他那儿借来的 jQuery的事件处理机制吸取了JavaScript专家Dean Edwa ...

  7. 从零开始学习jQuery (五) 事件与事件对象

    本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...

  8. jQuery入门(3)事件与事件对象

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  9. jQuery队列操作

    jQuery.queue 1."fx"是什么? 队列动画的默认名称 队列的名字为type + "queue",默认是"fxqueue" 2. ...

随机推荐

  1. 4Sum II

    https://leetcode.com/submissions/detail/153740275/ class Solution { public: int fourSumCount(vector& ...

  2. Appium环境搭建及“fn must be a function”问题解决

    由于appium在线安装比较困难,大多数应该是由于FQ造成的吧,索性直接下载appium安装包:http://pan.baidu.com/s/1bpfrvjD nodejs下载也很缓慢,现提供node ...

  3. Android Kotlin适用小函数

    都是一些Android适用的Kotlin小函数. 1.点击空白隐藏键盘 //点击空白隐藏键盘 override fun onTouchEvent(event: MotionEvent): Boolea ...

  4. python并发编程相关概念总结

    1.简述计算机操作系统中的“中断”的作用? 中断是指在计算机执行期间,系统内发生任何非寻常的或非预期的急需处理事件,使得CPU暂时中断当前正在执行的程序而转去执行相应的时间处理程序.待处理完毕后又返回 ...

  5. 【NopCommerce 3.1】asp.net mvc 利用jQuery from.js上传用户头像

    纯代码不解释. 在CusotmerControllers中添加上传方法 /// <summary> /// ajax上传用户头像 /// </summary> /// < ...

  6. 史上最权威的 Activiti 框架学习

        Activiti5 是 由 Alfresco 软件在 2010 年 5 月 17 日发布的业务流程管理( BPM) 框架,它是覆盖了业务流程管理.工作流.服务协作等领域 的一个开源的.灵活的. ...

  7. leetcode 【 Subsets 】python 实现

    题目: Given a set of distinct integers, S, return all possible subsets. Note: Elements in a subset mus ...

  8. MOCTF 简单注入

    最近在练习sql注入写脚本,记录一下思路,刚学的and 1=1也拿出来溜溜 http://119.23.73.3:5004/?id=1 首先,没有被过滤是正常显示. 没有被过滤但是查询不到就是空白,比 ...

  9. c++ 吕凤翥 第五章 类对象一

    一   类的声明和实现 1. class tdate   //声明部分 { public: void setdate(int y,int m,int d); int isleapyear(); voi ...

  10. iOS xmpp Openfire+spark环境搭建

    配置这个遇到太多问题了,写下来分享 首先到官网下载openfire+spark 下载地址:http://www.igniterealtime.org/downloads/index.jsp