精华内容
下载资源
问答
  • layui 封装集成jquery 的工具类

    千次阅读 2019-02-14 12:00:24
    分享一个自己写的方便操作layuijquery工具类 文档 jquery.layui.util.js 1.tableGetCheckIds 简介 获取layui table 所有选中的id 参数 tableId(table组件的id) 返回值 选中的所有id以","结尾...

    分享一个自己写的方便操作layui的jquery工具类

    文档

    jquery.layui.util.js

    1.tableGetCheckIds
    	简介
    		获取layui table 所有选中的id
    	参数
    		tableId(table组件的id)
    	返回值
    		选中的所有id以","结尾的字符串
    	用法
    		$.lay.tableGetCheckIds("test");
    
    2.reloadAllIframe
    	简介
    		刷新基础父窗口对象的所有子iframe
    	参数
    		无
    	返回值
    		无
    	用法
    		$.lay.reloadAllIframe();
    
    3.reloadUseIframe
    	简介
    		刷新使用者的iFame
    	参数
    		无
    	返回值
    		无
    	用法
    		$.lay.reloadUseIframe();
    
    4.reloadIframe
    	简介
    		刷新当前的iframe
    	参数
    		无
    	返回值
    		无
    	用法
    		$.lay.reloadUseIframe();
    
    5.addLayVerify
    	简介
    		向指定对象添加lay-verify的验证元素,类似于jquery的addClass的用法
    	参数
    		$dom(元素jquery对象),verify(验证字符串)
    	返回值
    		无
    	用法
    		$.lay.addLayVerify($("input"),phone);
    
    6.removeLayVerify
    	简介
    		向指定对象移除lay-verify的验证元素,类似于jquery的removeClass的用法
    	参数
    		$dom(元素jquery对象),verify(验证字符串)
    	返回值
    		无
    	用法
    		$.lay.addLayVerify($("input"),phone);
    
    7.openIframe
    	简介
    		打开layui iframe弹出窗
    	参数
    		 * @bootTitle 弹窗框标题 默认不显示
    		 * @bootUrl 弹窗框访问的url 默认404
    		 * @bootWidth 弹窗框高度 默认自适应
    		 * @bootHeight 弹窗框宽度 默认自适应
    		 * @end 弹窗框销毁 执行函数 默认刷新 使用这个函数的页面
    	返回值
    		无
    	用法
    		$.lay.openIframe("新的弹出层",“后台访问路径或者前台url”);
    
    8.confirm
    	简介
    		打开layui询问窗
    	参数
    		 * @bootTitle 弹窗框标题 默认不显示
    		 * @bootUrl 弹窗框访问的url 默认404
    		 * @successFunction 弹窗框发送请求回调 执行函数 默认刷新 使用这个函数的页面
    	返回值
    		无
    	用法
    		$.lay.confirm("您确认要删除吗",“ajax请求路径”);
    
    9.closeIframe
    	简介
    		关闭当前打开的窗口
    	参数
    		无
    	返回值
    		无
    	用法
    		$.lay.closeIframe();
    

    代码

    位置:码云地址

    /**
     * layui 的工具类 集成到jquery上 调用方式 $.lay.method
     */
    (function($) {
    	// 扩展这个方法到jQuery.
    	// $.extend() 是吧方法扩展到 $ 对象上,和 $.fn.extend 不同。
    	// 扩展到 $.fn.xxx 上后,调用的时候就可以是 $(selector).xxx()
    	// $.xxx 后 是$..
    	layui.use([ 'form', 'layer', 'laydate', 'table', 'laytpl' ], function() {
    		var form = layui.form, layer = parent.layer === undefined ? layui.layer : top.layer, $ = layui.jquery, laydate = layui.laydate, laytpl = layui.laytpl, table = layui.table;
    		$.extend({
    			lay : {
    				/**
    				 * 获取layui table 所有选中的id
    				 */
    				tableGetCheckIds : function(tableId) {
    					var checkStatus = table.checkStatus(tableId);
    					var data = checkStatus.data;
    					var ids = new Array();
    					for ( var key in data) {
    						ids.push(data[key].id);
    					}
    					return ids.join(",");
    				},
    				/**
    				 * 刷新基础父窗口对象的所有子iframe
    				 */
    				reloadAllIframe : function() {
    					parent.$("iframe").each(function() {
    						$(this).attr('src', $(this).attr('src')); // 需要引用jquery
    					})
    				},
    				/**
    				 * 刷新使用者的iFame
    				 */
    				reloadUseIframe : function() {
    					$(".layui-tab-item.layui-show", top.document).find("iframe")[0].contentWindow.location.reload();
    				},
    				/**
    				 * 刷新自己的iframe
    				 */
    				reloadIframe : function() {
    					location.reload();
    				},
    
    				/**
    				 * 追加验证
    				 * https://www.cnblogs.com/nuysoft/archive/2011/12/27/2300675.html
    				 */
    				addLayVerify : function($dom,verify) {
    					$dom.each(function(){
    						var $this =$(this);
    						 var layVerify =$this.attr("lay-verify");
    						 if(layVerify){  // 判断是否存在元素
    							 var index = _.indexOf(layVerify.split("|"),verify);
    							 if(index!=-1){
    								 return;
    							 }
    							 layVerify+="|";
    						 }
    						layVerify+=verify;
    						$this.attr("lay-verify",layVerify); 
    					});
    				},
    				/**
    				 * 移除验证
    				 */
    				removeLayVerify : function($dom,verify) {
    					$dom.each(function(){
    						var $this =$(this);
    					 var layVerify =$this.attr("lay-verify");
    					 if(layVerify){  // 判断是否存在元素
    						 var layVerify = layVerify.split("|");
    						 var index = _.indexOf(layVerify,verify);
    						 if(index!=-1){ // 存在元素就删除
    							 layVerify.remove(verify);
    							 $this.attr("lay-verify",layVerify.join("|")); 
    						 }
    					 }
    					});
    				},
    				/**
    				 * 打开弹窗窗口
    				 * 
    				 * @bootTitle 弹窗框标题 默认不显示
    				 * @bootUrl 弹窗框访问的url 默认404
    				 * @bootWidth 弹窗框高度 默认自适应
    				 * @bootHeight 弹窗框宽度 默认自适应
    				 * @end 弹窗框销毁 执行函数 默认刷新 使用这个函数的页面
    				 */
    				openIframe : function(bootTitle, bootUrl, bootWidth, bootHeight, end) {
    					// 如果是移动端,就使用自适应大小弹窗
    					if (navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)) {
    						width = 'auto';
    						height = 'auto';
    					}
    					if (_.isEmpty(bootTitle)) {
    						bootTitle = false;
    					}
    					if (_.isEmpty(bootUrl)) {
    						bootUrl = "/error404";
    					}
    					if (_.isEmpty(bootWidth)) {
    // bootWidth = ($(window).width() * 0.5);
    						bootWidth = 800;
    					}
    					if (_.isEmpty(bootHeight)) {
    						bootHeight = ($(window).height() - 50);
    					}
    					if (_.isEmpty(end)) { // 默认刷新
    						end = function() {
    							// location.reload();
    						}
    					}
    					/*
    					 * //获取父页面的的url 然后进行刷新 layer.iframeSrc(index,
    					 * 'http://sentsin.com');
    					 */
    					var index = layer.open({
    						type : 2, // 设置弹窗类型为iframe
    						area : [ bootWidth + 'px', bootHeight + 'px' ],  // area
    																			// - 宽高
    						fix : false, // 不固定
    						maxmin : true,
    						shadeClose : false, // shadeClose - 是否点击遮罩关闭
    						shade : 0.3, // shade - 遮罩 默认0.3
    // offset : 't', //offset - 坐标
    						title : bootTitle,  // title - 标题
    						content : bootUrl, // content - 内容
    // scrollbar : false, // 是否允许浏览器出现滚动条
    						anim:0 ,// anim - 弹出动画 默认0
    						resizing : function(layero) {
    							layer.iframeAuto(index);// 指定iframe层自适应
    						},
    						success : function(layero, index) { // 弹出时
    							// layero 打开窗口的元素对象 ,index 窗口的索引
    							var $iframe = $(layero).find('iframe')[0]; // 获取打开的iframe对象
    							// 获取当前页面的iframe
    							$iframe.contentWindow.useIframe = window.name;
    						},
    						end : end
    					});
    					$(window).resize(function(){
    					    $(".layui-layer-maxmin").parents(".layui-layer").width($(window).width()).height($(window).height());
    					});
    				},
    				/**
    				 * 打开询问窗
    				 * 
    				 * @bootTitle 弹窗框标题 默认不显示
    				 * @bootUrl 弹窗框访问的url 默认404
    				 * @successFunction 弹窗框发送请求回调 执行函数 默认刷新 使用这个函数的页面
    				 */
    				confirm : function(bootTitle, bootUrl, successFunction) {
    					if (_.isEmpty(bootTitle)) {
    						bootTitle = '提示信息';
    					}
    					if (_.isEmpty(bootUrl)) {
    						bootUrl = "/error404";
    					}
    					if (_.isEmpty(successFunction)) {
    						successFunction = function() {
    							$(".boot-search-btn").click();
    						}
    					}
    					layer.confirm(bootTitle, {
    						icon : 3,
    						title : '提示信息'
    					}, function(index) {
    						$.get(bootUrl, {}, function(result) {
    							layer.msg(result.msg);
    							$.lay.reloadUseIframe();
    						});
    					});
    				},
    				/**
    				 * 关闭当前打开的窗口
    				 */
    				closeIframe : function() {
    					var index = parent.layer.getFrameIndex(window.name); // 先得到当前iframe层的索引
    					parent.layer.close(index);
    				}
    			}
    		});
    	});
    	// 传递jQuery到内层作用域去, 如果window,document用的多的话, 也可以在这里传进去.
    	// })(jQuery, window, document, undefined);
    })(jQuery, undefined);
    // 调用方式 $(".selector").pluginName().otherMethod();
    
    
    展开全文
  • jQueryjQuery插件jQuery教程layui 集成第三方和自定义组件到模块规范 1、新建一个layui.extend.js文件,页面调用时这个文件放到layui.js后面。2、基础的配置卸载config中,扩展的组件写入extend,组件的路径是相对于...

    jQuery

    jQuery插件

    jQuery教程

    layui 集成第三方和自定义组件到模块规范

    1、新建一个layui.extend.js文件,页面调用时这个文件放到layui.js后面。

    2、基础的配置卸载config中,扩展的组件写入extend,组件的路径是相对于config下base的路径。

    例如:

    layui.config({

    version: false, //一般用于更新模块缓存,默认不开启。设为true即让浏览器不缓存。也可以设为一个固定的值,如:201610

    debug: false, //用于开启调试模式,默认false,如果设为true,则JS模块的节点会保留在页面

    base: '/Resource/layuiadmin/lib/' //设定扩展的Layui模块的所在目录,一般用于外部模块扩展

    }).extend({

    index: 'index', //主入口模块,

    treetable: '../modules/treetable',

    eleTree: 'extend/eleTree/eletree', // {/}的意思即代表采用自有路径,即不跟随 base 路径

    treeSelect: 'extend/treeSelect',

    step: 'step-lay/step',

    tableSelect: 'extend/tableSelect',

    area: 'extend/areaselect/areaselect',

    autocomplete: 'extend/autocomplete/autocomplete',

    uploader: 'extend/uploader/uploader'

    });

    3、模块调用

    layui.use(['form', 'step', 'element', 'tableSelect', 'laytpl', 'laydate', 'area'], function () {

    var form = layui.form;

    var step = layui.step;

    ......

    var Project ={}//内部方法

    window.Operate={}//对外方法比如页面点击等

    });

    内容来源于网络,如有侵权请联系客服删除

    展开全文
  • 一:修改nicescroll github/* jquery.nicescroll-- version 3.7.6-- copyright 2017-07-19 InuYaksa*2017-- licensed under the MIT---- ...

    一:修改nicescroll   github

    /* jquery.nicescroll

    -- version 3.7.6

    -- copyright 2017-07-19 InuYaksa*2017

    -- licensed under the MIT

    --

    -- https://nicescroll.areaaperta.com/

    -- https://github.com/inuyaksa/jquery.nicescroll

    --

    */

    /* jshint expr: true */

    (function (factory) {

    if (typeof define === 'function' && define.amd) {

    // AMD. Register as anonymous module.

    define(['jquery'], factory);

    } else if (typeof exports === 'object') {

    // Node/CommonJS.

    module.exports = factory(require('jquery'));

    }else if (window.layui && layui.define) {  //layui加载

    layui.define('jquery',function (exports) {

    exports('nicescroll', factory(layui.jquery));

    });

    } else {

    // Browser globals.

    factory(jQuery);

    }

    }(function (jQuery) {

    "use strict";

    二:layui使用

    layui.config({

    base:'lib/nicescroll/jquery.'  //实际调用的js文件为 base+nicescroll.js。需根据实际情况修改

    }).use(['nicescroll'], function() {

    //代码

    var $ = layui.jquery;

    //美化滚动条

    $(".flow-default").niceScroll({

    cursorcolor: "#5B76A1", //#CC0071 光标颜色

    cursoropacitymax: 1, //改变不透明度非常光标处于活动状态(scrollabar“可见”状态),范围从1到0

    touchbehavior: false, //使光标拖动滚动像在台式电脑触摸设备

    cursorwidth: "5px", //像素光标的宽度

    cursorborder: "0", // 游标边框css定义

    cursorborderradius: "5px", //以像素为光标边界半径

    autohidemode: false //是否隐藏滚动条

    });

    });

    展开全文
  • layui自身集成jquery,所以想用$符号不用再引入jquery.js文件,只要声明jquery的模块就好了。例如: 然后就可以像使用jquery那样使用$符号了 但是呢,ztree树状图这里有用到jqueryjQuery,我们直接声明$...

     layui自身集成了jquery,所以想用$符号不用再引入jquery.js文件,只要声明jquery的模块就好了。例如:

    然后就可以像使用jquery那样使用$符号了

    但是呢,ztree树状图这里有用到jquery的jQuery,我们直接声明$符号来用会导致ztree某些引用jQuery变量的地方会报错。

    我也试过var $ = layui.$;var jQuery = layui.$; 的形式尝试声明他,但是后面还是不行,最后发现用window.jQuery = layui.$;的形式是可以的。

    关于不引入jquery.js,解决ztree和layui$符号和jQuery兼容的问题就分享到这里了

    展开全文
  • layui国际化-jQuery.i18n组件

    千次阅读 2020-03-31 21:55:51
    虽然layui的功能非常强大,有很多的功能模块,但是人无完人,框架也是一样,layui并没有一个国际化的模块,这里我们是吧jQuery的i18n集成到了layuiadmin. 模块扩展 与扩展echarts一样我们再config.js文件配置国际化...
  • layui layIM右键菜单集成

    千次阅读 2017-04-13 16:09:12
    效果图:(感谢@JOHNSON 提供的jquery插件,jquery插件改成layui模块化)       menu.js代码包: 右键菜单资源包  2016-12-19 menu.js代码更新,修复IE 8下对象属性的bug ...
  • 说明:官方文档写的特别好!但是我吧,光看是记不到啥东西的,所以就挑着自己写了点,emmmm,基本都是copy官网,就当是我在誊抄,加强...并且帮我们集成jQuerylayui.all.js:默认引入modules里面的所有模块。...
  • 框架主要使用thinkphp5.1 + layui + jquery。后台基于99Admin进行开发,具备auth权限认证管理功能,后台路径可以自行定义,防止别人能够轻易找到你的后台地址。权限节点可以自动进行更新,无需手动刷新。 另外集成了...
  • layuiEdit富文本集成

    2019-12-10 14:37:40
    1.相关代码 layui.use(['form','layer','laydate','table','laytpl'],function(){ var form = layui.form, layer = parent.layer === undefined ? layui.layer : top.layer, $ = layui.jquery,...
  • 集成cropper,jquery,layui的简单裁剪图片的组件,可以自定义上传图片的尺寸,比例等信息,及其裁剪上传后可以回显裁剪后的图片。支持一个界面上多个裁剪组件。 支持功能如下: ##1. 图片裁剪 ##2. 保存尺寸设置 ...
  • 很多时候,前端UI框架Layui都是一个不错的选择。简单,大方的设计,快速集成与应用,深受快速开发者的喜爱。...2)最核心的一点,检查$是否生效,是否单独引入了Jquery还是 var $ = layui.$; 添加声明。 详
  • jeecg集成实现websocket

    千次阅读 2016-08-16 10:39:05
     在jeecg各风格的首页引入layui.jsp这个文件为当前风格引入在线聊天功能,确保在jquery后引入,layim框架依赖于jquery。 在layui.jsp中引入了如下三个文件,layui.css和layui.js分别是layui框架的cs
  • layui和iview中都有现成的Autocomplete插件,但是需要集成layui和iview相关的依赖,我就是想在一个简单的业务环境中实现这个功能,而且在系统的业务框架中也没有集成相关的环境,所以采用这种方式性价比很低。...
  • JQuery Validate插件是一个非常简单,但又便捷的插件,可以被用来验证表单数据。... 而Jquery Validate插件,是一个已经被集成好了的插件,就像是HTML使用bootstrap或者layui来替代那些乱七八糟的CSS代码
  • 类似于jquery的框架,语法和jquery类似,会用jquery就会用Zepto。 2.sea.js 类似于requireJS。SeaJS 是一个适用于 Web 浏览器端的模块加载器。使用 SeaJS,可以更好地组织 JavaScript 代码。 3.Video.js 视频...
  • 在实际工作中入手,如何快速的开发一个后台管理系统呢?技术选型是啥?...Spring Boot 整合 Layui 实现后台管理模板,包括集成 jQuery serializeJSON 、封装 Treegrid 、时间工具 JS、文件上传 JS; Sp...
  • laravel queryList万能采集器这套根据 kongqi laravel admin2.0 layui 框架做的插件,用于采集内容,以上采集器仅供学习和研究。特色jquery选择器写法编写了处理自定义函数队列采集在线采集采集多线程在线/队列入...
  • 最近也是做了一下这个验证码小案例,希望能帮到有...我是通过集成第三方的sdk完成的,前端使用Layui+JQuery,后端使用的是SpringBoot。   第三方sdk依赖 <dependency> <groupId>cn.hutool</group
  • ——————————————版本:springBoot 2.0,jdk1.8,编译器:idea前端框架:layUI 或 bootstrap,jquery运用插件设置:myMapper,MyBatis,热部署,redis等——————————————第一篇暂时讲解前面6...
  • 认识框架

    2021-01-30 09:18:27
    前端框架:JQuery BootStrap LayUI EasyUI 后端框架: SSM框架: Spring+SpringMVC+MyBatis SSH框架: Spring+Struct2+Hibernate SpringBoot框架 SpringCloud微服务(分布开发、业务性能、并发、集群) SSM:里面三个...
  • ○ 富文本编辑器:集成layui社区的layedit、kz.layedit、tinymce编辑器 ○ 上传下载:集成普通文件上传、图片上传、多文件上传、拖动上传、腾讯云COS存储等功能 ○ 导入导出:引入POI工具,整合excel等导入导出...
  • ○ 富文本编辑器:集成layui社区的layedit、kz.layedit、tinymce编辑器 ○ 上传下载:集成普通文件上传、图片上传、多文件上传、拖动上传、腾讯云COS存储等功能 ○ 导入导出:引入POI工具,整合excel等导入导出...
  • 基于SSM的在线音乐网站开发与实现...这也是本人大学四年开发时长及代码量最长的项目,项目后端基于SpringMVC+Spring+Mybatis实现,同时通过Vue/JQuery+Ajax/Axios实现前后端分离,没有使用任何模板引擎,这也是我对项目
  • 3、前台技术,layui+jquery+ajax 网站设计思路: 前台渲染是采用的jsp技术,为了保证网站的速度,我使用了几种方法: 1、我将重复的代码保存成单独的jsp文件然后引入(这样的好处就是重复的jsp文件只会加载一次,...
  • 结合Jquery Ajax,整合前端Layer.js(提供弹窗)+Bootstrap-table(数据列表展示)+ Bootstrap-Export(各种报表导出SQL,Excel,pdf等)框架,整合Echars,各类图表的展示(折线图,饼图,直方图等),使用了layui的...
  • 项目描述 在上家公司自己集成的一套系统,用了两个多月的时间完成的:Springboot+Mybatis-plus+ SpringMvc+Shiro+Redis企业级开发系统 Springboot作为容器,使用mybatis作为持久层框架 使用官方推荐的thymeleaf做为...
  • Jquery Layui JSON Ajax Lerx 网站内容管理系统主要功能 前后台用户及角色管理、站点管理、栏目、文章管理、模板管理、自由开放的模板市场、系统监测、调查(投票及点赞)、评论、全面的日志系统、来访登记统计...
  • jQuery layui v2.5.6 (UI框架) 后端 spring boot v2.2.4.RELEASE Mybatis Mybatis-plus v3.3.0 (mybatis增强插件,无侵入。非常强大的插件,除了联表操作,几乎都可以使用它的sql条件构造器完成) Shiro v1.4.0 ...
  • jQuery Node 常用 api、对象池、异常处理、进程通信、高并发 静态类型检查 TypeScript Flow 构建/打包工具 webpack gulp rollup 包管理工具 npm yarn 服务端渲染 koa2 express nuxt next 五...

空空如也

空空如也

1 2
收藏数 30
精华内容 12
关键字:

layui集成jquery