# LayuiExtend **Repository Path**: iTiki/LayuiExtend ## Basic Information - **Project Name**: LayuiExtend - **Description**: LayUI 扩展组件 by iTanken(子兮子兮) - **Primary Language**: JavaScript - **License**: Not specified - **Default Branch**: master - **Homepage**: https://itiki.gitee.io/layuiextend/ - **GVP Project**: No ## Statistics - **Stars**: 31 - **Forks**: 11 - **Created**: 2019-04-11 - **Last Updated**: 2025-07-08 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # LayuiExtend > 基于 LayUI 的扩展组件 ## 组件列表 ### 1. [数字输入框](https://github.com/iTanken/LayuiExtend/tree/master/js/modules/numinput) [在线示例](https://itanken.github.io/LayuiExtend/) #### 数字输入框用法 > 支持 min/max,及附加的 data-prec 用于控制小数精确度: > > ``` html >
> >
> ``` > > ``` javascript > layui.config({ base: 'js/modules/' }).extend({ > numinput: 'numinput/numinput' > }).use(['form', 'numinput'], function() { > var $ = layui.$, form = layui.form, numinp = layui.numinput; > numinp.init({ > // 123:123键置顶, 789:789键置顶 > topBtns: 123, > // 右侧功能按钮开关 > rightBtns: true, > // 功能按钮提示开关 > showTips: true, > // 是否监听键盘事件 > listening: true, > // 批量配置默认小数精确度,默认 -1 不处理精确度,0 表示禁止输入小数 > defaultPrec: -1, > // 初始化回调,无参 > initEnd: $.noop, > // 触发显示回调,参数为当前输入框和数字键盘的 jQuery 对象 > showEnd: $.noop, > // 隐藏键盘回调,参数为当前输入框的 jQuery 对象 > hideEnd: $.noop, > // 自定义 z-index > zIndex: 19999999 > }); > }); > ``` --- ### 2. [文本工具条](https://github.com/iTanken/LayuiExtend/tree/master/js/modules/textool) [在线示例](https://itanken.github.io/LayuiExtend/) #### 文本工具条用法 > ``` javascript > layui.config({ base: 'js/modules/' }).extend({ > numinput: 'textool/textool.min' > }).use(['form', 'textool'], function() { > var $ = layui.$, form = layui.form, textool = layui.textool; > textool.init({ > // 根据元素 id 值单独渲染,为空默认根据 class='layext-text-tool' 批量渲染 > eleId: null, > // 批量设置输入框最大长度,可结合 eleId 单独设置最大长度 > maxlength: -1, > // 初始化回调,无参 > initEnd: $.noop, > // 显示回调,参数为当前输入框和工具条面板的 jQuery 对象 > showEnd: $.noop, > // 隐藏回调,参数为当前输入框和工具条面板的 jQuery 对象 > hideEnd: $.n > // 初始化展开,默认展开,否则收起 > initShow: true, > // 工具条是否位于输入框内部,默认位于外部 > inner: false, > // 对齐方向,默认右对齐,可选左对齐 'left' > align: 'right', > // 启用指定工具模块,默认依次为字数统计、复制内容、重置内容、清空内容,按数组顺序显示 > tools: ['count', 'copy', 'reset', 'clear'], > // 工具按钮提示类型,默认为 'title' 属性,可选 'laytips',使用 layer 组件的吸附提示, 其他值不显示提示 > tipType: 'title', > // 吸附提示背景颜色 > tipColor: '#01AAED', > // 工具条字体颜色 > color: '#666666', > // 工具条背景颜色 > bgColor: '#FFFFFF', > // 工具条边框颜色 > borderColor: '#E6E6E6', > // 工具条附加样式类名 > className: '', > // z-index > zIndex: 19891014 > }); > }); > ``` --- ### 3. developing ···