layui(iconPickerFa)图标选择器插件,主要用于后台菜单图标管理

话不多说直接上代码

在页面中引入如下代码

<link rel="stylesheet" href="/template/admin/layui-v2.5.6/css/layui.css">
<script type="text/javascript" src="/template/admin/layui-v2.5.6/layui.js"></script>
<script type="text/javascript" src="/template/admin/iconPicker/iconPickerFa.js"></script>

第二步html页面如图

<div class="form-group"><label class="col-sm-2 control-label">选择图标</label><div class="col-sm-3"><input type="text" id="icon" name="menu[icon]" lay-filter="icon" class="hide" value="fa fa-list"></div>
</div>

第三步如图代码

<script>layui.use(['form', 'upload', 'jquery','table'], function() {var form = layui.form,upload = layui.upload,iconPickerFa = layui.iconPickerFa,$ = layui.jquery;var table = layui.table;var iconLess="/template/admin/font-awesome-4.7.0/less/variables.less"iconPickerFa.render({elem: '#icon',url: iconLess,limit: 12,click: function (data) {$('#icon').val('fa ' + data.icon);},success: function (d) {console.log(d);}});})
</script>

最终呈现如下图

layui iconPicker插件下载地址

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/579550.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SpringCloud 整合 Canal+RabbitMQ+Redis 实现数据监听

1Canal介绍 Canal 指的是阿里巴巴开源的数据同步工具&#xff0c;用于数据库的实时增量数据订阅和消费。它可以针对 MySQL、MariaDB、Percona、阿里云RDS、Gtid模式下的异构数据同步等情况进行实时增量数据同步。 当前的 canal 支持源端 MySQL 版本包括 5.1.x , 5.5.x , 5.6.…

CAN协议FPGA篇

一.引言 CAN&#xff08;Controller Area Network&#xff09;总线&#xff0c;即控制器局域网总线&#xff0c;是一种功能丰富的车用总线标准。该协议最初是由德国博世&#xff08;Bosch&#xff09;公司在1983年制定的&#xff0c;之后在美国密歇根州底特律举行的汽车工程师协…

Socks5代理IP在跨境电商与游戏中的应用

随着互联网的迅猛发展&#xff0c;网络已经成为人们日常生活不可或缺的一部分。在这个数字化时代&#xff0c;跨境电商和网络游戏产业蓬勃发展&#xff0c;但伴随而来的是网络安全的威胁与挑战。本文将介绍Socks5代理IP技术&#xff0c;探讨它在网络安全、跨境电商以及游戏中的…

Hive03_数据类型

数据类型 1 案例实操 &#xff08;1&#xff09;假设某表有如下一行&#xff0c;我们用 JSON 格式来表示其数据结构。在 Hive 下访问的格式为 {"name": "wukong","friends": ["bajie" , "lili"] , //列表 Array, "c…

jupyter notebook打开其他盘的文件

jupyter notebook打开其他盘文件 打开jupyter notebook打开terminal输入&#xff1a;jupyter-notebook 路径打开你想打开的工程的文件 打开jupyter notebook 打开terminal 输入&#xff1a;jupyter-notebook 路径 打开你想打开的工程的文件

odoo17核心概念view7——listview总体框架分析

这是view系列的第七篇文章&#xff0c;今天主要介绍我们最常用的list视图。 1、先看list_view,这是主文件 /** odoo-module */import { registry } from "web/core/registry"; import { RelationalModel } from "web/model/relational_model/relational_mode…

Typora使用PicGo+Gitee上传图片报错403 Forbidden

Typora使用PicGoGitee上传图片报错403 Forbidden Typora使用PicGoGitee上传图片&#xff0c;上传失败了&#xff0c;错误信息如下 打开PicGo的日志文件查看&#xff0c;可以看到错误详情如下 换了一个插件github-plus重新配置&#xff0c;解决了这个问题 再打开日志查看&…

使用 AnyGo 修改 iPhone 手机定位

在当今数字化时代&#xff0c;我们的手机已经成为我们日常生活中不可或缺的一部分。然而&#xff0c;有时我们可能会遇到一些情况&#xff0c;需要修改手机的定位信息。这个需求可能来自于各种不同的原因&#xff0c;包括但不限于保护个人隐私、测试应用程序的地理位置相关功能…

【kafka消息里会有乱序消费的情况吗?如果有,是怎么解决的?】

文章目录 什么是消息乱序消费了&#xff1f;顺序生产&#xff0c;顺序存储&#xff0c;顺序消费如何解决乱序数据库乐观锁是怎么解决这个乱序问题吗 保证消息顺序消费两种方案固定分区方案乐观锁实现方案 前几天刷着视频看见评论区有大佬问了这个问题&#xff1a;你们的kafka消…

Linux - 记录问题:怎么通过安装包的方式安装gRPC

适用场景 当docker 构建环境不能链接到github 的时候&#xff0c;就可以使用本地构建的方式 完成对应服务的构建需求。 参考案例 使用本地安装包的方式安装 gRPC 注意&#xff1a; 在Docker构建过程中&#xff0c;某些软件包可能会尝试配置时区&#xff0c;这通常需要交互式…

WordPress主题大前端DUX v8.3源码下载

DUX主题8.3版本更新内容&#xff1a; 新增&#xff1a;Cloudflare Turnstile 免费验证功能 新增&#xff1a;子菜单页面模版&#xff0c;支持多级页面 新增&#xff1a;手机端文章内表格自动出现横向滚动条&#xff0c;可集体或单独设置滚动宽度 新增&#xff1a;标签云页面模版…

【MATLAB第86期】基于matlab的Catboost多输入单输出分类预测模型 catboost-1.1.1版本

基于matlab的Catboost多输入单输出分类预测模型 catboost-1.1.1版本 运行环境 windows10 matlab2020a catboost版本&#xff1a;catboost-1.1.1 往期&#xff1a; 【MATLAB第20期】基于matlab的Catboost多输入单输出回归预测模型 catboost-1.1.1版本 一、导入数据 采用12输…

Spark与Hadoop的关系和区别

在大数据领域&#xff0c;Spark和Hadoop是两个备受欢迎的分布式数据处理框架&#xff0c;它们在处理大规模数据时都具有重要作用。本文将深入探讨Spark与Hadoop之间的关系和区别&#xff0c;以帮助大家的功能和用途。 Spark和Hadoop简介 1 Hadoop Hadoop是一个由Apache基金会…

Linux和Win 共享文件夹 搭建使用方法【超简单】+ 共享后无法出现文件夹的解决方式

win和Linux 共享文件夹 超简单的搭建使用方法 一、编辑虚拟机设置二、在Linux下访问共享文件夹三、共享后无法出现文件夹的解决方式 很多时候我们需要在Linux环境下使用一些安装包。 一般都是在win下进行下载&#xff0c;然后通过共享文件夹的方式&#xff0c;共享到虚拟机环境…

Xmake v2.8.6 发布,新的打包插件:XPack

Xmake 是一个基于 Lua 的轻量级跨平台构建工具。 它非常的轻量&#xff0c;没有任何依赖&#xff0c;因为它内置了 Lua 运行时。 它使用 xmake.lua 维护项目构建&#xff0c;相比 makefile/CMakeLists.txt&#xff0c;配置语法更加简洁直观&#xff0c;对新手非常友好&#x…

手机软件APP下载类网站Pbootcms模板 游戏软件应用网站源码 模板自适应手机端

手机软件APP下载类网站pbootcms模板 游戏软件应用网站源码 模板自适应手机端 pbootcms内核开发的网站模板,该模板适用于手机APP网站、游戏软件网站等企业, 当然其他行业也可以做,只需要把文字图片换成其他行业的即可; 自适应,同一个后台,数据即时同步,简单适用!附带…

超维空间S2无人机使用说明书——52、使用PID算法进行基于yolo的目标跟踪

引言&#xff1a;在实际工程项目中&#xff0c;为了提高系统的响应速度和稳定性&#xff0c;往往需要采用一定的控制算法进行目标跟踪。这里抛砖引玉&#xff0c;仅采用简单的PID算法进行目标的跟随控制&#xff0c;目标的识别依然采用yolo。对系统要求更高的&#xff0c;可以对…

基于Java在线商城系统设计实现(源码+部署文档+讲解视频)

博主介绍&#xff1a; ✌至今服务客户已经1000、专注于Java技术领域、项目定制、技术答疑、开发工具、毕业项目实战 ✌&#x1f345; 文末获取源码联系 &#x1f345;&#x1f447;&#x1f3fb; 精彩专栏 推荐订阅 &#x1f447;&#x1f3fb; 不然下次找不到 Java项目精品实…

使用YT Config Tools工具导出引脚配置清单至Excel文件

使用YT Config Tool工具导出引脚配置清单至Excel文件 文章目录 使用YT Config Tool工具导出引脚配置清单至Excel文件IntroductionOperations在YTC中导入hello_world样例工程在Pinout Configuration标签页中配置引脚保存源码工程导出Excel文件 Conclusion Introduction YT Conf…

GC6208国产5V摄像机镜头驱动IC ,可用于摄像机,机器人等产品中可替代AN41908

GC6208是一个镜头电机驱动IC摄像机和安全摄像机。该设备集成了一个直流电机驱动器的Iris的PID控制系统&#xff0c;也有两个通道的STM电机驱动器的变焦和对焦控制。 芯片的特点: 内置用于Iris控制器的直流电机驱动器 内置2个STM驱动程序&#xff0c;用于缩放和…