diff --git a/docs/nav/index.md b/docs/nav/index.md index d7bc81d9..646fe4d9 100644 --- a/docs/nav/index.md +++ b/docs/nav/index.md @@ -223,7 +223,7 @@ toc: true `element.render('nav', filter);` - 参数 `'nav'` 是渲染导航的固定值 -- 参数 `filter` : 对应导航容器 `lay-filter` 的属性值 +- 参数 `filter` : 对应导航容器 `lay-filter` 的属性值或2.9.15+指定元素的 jQuery 对象 `nav` 组件会在元素加载完毕后,自动对导航完成一次渲染,因此该方法主要用于对动态插入的导航元素的初始化渲染。 @@ -342,6 +342,6 @@ layui.use(function(){ `element.render('breadcrumb', filter);` - 参数 `'breadcrumb'` 是渲染面包屑导航的固定值 -- 参数 `filter` : 对应面包屑导航容器 `lay-filter` 的属性值 +- 参数 `filter` : 对应面包屑导航容器 `lay-filter` 的属性值或2.9.15+指定元素的 jQuery 对象 该方法主要用于对动态插入的面包屑导航的初始化渲染,用法同上述导航菜单。 diff --git a/docs/panel/index.md b/docs/panel/index.md index c73c51fc..27ad408e 100644 --- a/docs/panel/index.md +++ b/docs/panel/index.md @@ -217,7 +217,7 @@ toc: true `element.render('collapse', filter);` - 参数 `'collapse'` : 渲染折叠面板的固定值 -- 参数 `filter` : 对应折叠面板容器 `lay-filter` 的属性值 +- 参数 `filter` : 对应折叠面板容器 `lay-filter` 的属性值或2.9.15+指定元素的 jQuery 对象 在元素加载完毕后,`element` 模块会自动对元素进行一次渲染。而当元素为动态插入时,需通过该方法完成初始化渲染。 diff --git a/docs/progress/index.md b/docs/progress/index.md index d9ba8402..6a9ae5b5 100644 --- a/docs/progress/index.md +++ b/docs/progress/index.md @@ -140,7 +140,7 @@ toc: true `element.render('progress', filter);` - 参数 `'progress'` : 渲染进度条的固定值 -- 参数 `filter` : 对应进度条容器 `lay-filter` 的属性值 +- 参数 `filter` : 对应进度条容器 `lay-filter` 的属性值或2.9.15+指定元素的 jQuery 对象 在元素加载完毕后,element 模块会自动对元素进行一次渲染。而当元素为动态插入时,需通过该方法完成初始化渲染。 diff --git a/docs/tab/index.md b/docs/tab/index.md index 22d41e10..d468706f 100644 --- a/docs/tab/index.md +++ b/docs/tab/index.md @@ -152,8 +152,8 @@ tab 组件提供了三种 UI 风格,分别为: `element.render('tab', filter);` -- 参数 `'tab'` 是渲染 tab 的固定值 -- 参数 `filter` : 对应 tab 容器 `lay-filter` 的属性值 +- 参数 `'tab'` 是渲染 tab 的固定值。 +- 参数 `filter` : 对应 tab 容器 `lay-filter` 的属性值或2.9.15+指定元素的 jQuery 对象。 tab 组件会在元素加载完毕后,自动对 tab 元素完成一次渲染,因此该方法主要用于对动态插入的 tab 元素的初始化渲染。 diff --git a/src/modules/element.js b/src/modules/element.js index ddc9eddc..8efdf3f3 100644 --- a/src/modules/element.js +++ b/src/modules/element.js @@ -230,14 +230,15 @@ layui.define('jquery', function(exports){ } // Tab 自适应 - ,tabAuto: function(spread){ + ,tabAuto: function(spread, elem){ var SCROLL = 'layui-tab-scroll'; var MORE = 'layui-tab-more'; var BAR = 'layui-tab-bar'; var CLOSE = 'layui-tab-close'; var that = this; + var targetElem = elem || $('.layui-tab'); - $('.layui-tab').each(function(){ + targetElem.each(function(){ var othis = $(this); var title = othis.children('.layui-tab-title'); var item = othis.children('.layui-tab-content').children('.layui-tab-item'); @@ -414,16 +415,16 @@ layui.define('jquery', function(exports){ // 初始化元素操作 Element.prototype.init = function(type, filter){ var that = this, elemFilter = function(){ - return filter ? ('[lay-filter="' + filter +'"]') : ''; + return (typeof filter === 'string' && filter) ? ('[lay-filter="' + filter +'"]') : ''; }(), items = { // Tab 选项卡 - tab: function(){ - call.tabAuto.call({}); + tab: function(elem){ + call.tabAuto.call({}, elem); } // 导航菜单 - ,nav: function(){ + ,nav: function(elem){ var TIME = 200; var timer = {}; var timerMore = {}; @@ -491,7 +492,8 @@ layui.define('jquery', function(exports){ }; // 遍历导航 - $(NAV_ELEM + elemFilter).each(function(index) { + var targetElem = elem || $(NAV_ELEM + elemFilter); + targetElem.each(function(index) { var othis = $(this); var bar = $(''); var itemElem = othis.find('.'+NAV_ITEM); @@ -553,10 +555,11 @@ layui.define('jquery', function(exports){ } //面包屑 - ,breadcrumb: function(){ + ,breadcrumb: function(elem){ var ELEM = '.layui-breadcrumb'; - - $(ELEM + elemFilter).each(function(){ + var targetElem = elem || $(ELEM + elemFilter); + + targetElem.each(function(){ var othis = $(this) ,ATTE_SPR = 'lay-separator' ,separator = othis.attr(ATTE_SPR) || '/' @@ -571,9 +574,11 @@ layui.define('jquery', function(exports){ } //进度条 - ,progress: function(){ + ,progress: function(elem){ var ELEM = 'layui-progress'; - $('.' + ELEM + elemFilter).each(function(){ + var targetElem = elem || $('.' + ELEM + elemFilter); + + targetElem.each(function(){ var othis = $(this) ,elemBar = othis.find('.layui-progress-bar') ,percent = elemBar.attr('lay-percent'); @@ -593,10 +598,11 @@ layui.define('jquery', function(exports){ } //折叠面板 - ,collapse: function(){ + ,collapse: function(elem){ var ELEM = 'layui-collapse'; + var targetElem = elem || $('.' + ELEM + elemFilter); - $('.' + ELEM + elemFilter).each(function(){ + targetElem.each(function(){ var elemItem = $(this).find('.layui-colla-item') elemItem.each(function(){ var othis = $(this) @@ -616,6 +622,11 @@ layui.define('jquery', function(exports){ } }; + if(type && typeof filter === 'object' && filter instanceof $){ + var targetElem = filter; + return items[type](targetElem); + } + return items[type] ? items[type]() : layui.each(items, function(index, item){ item(); });