当前位置: 首页 > news >正文

Layui —— select

前言:

       记录在修改bug时遇到的一些奇怪问题。

        遇到的奇怪问题1:

                项目中引入了 layui,而且也使用了 layui.use 按需导入了需要的组件,但是在页面每次刚初始化的时候去使用layui,控制台都会报 组件未定义的问题(正常打印layui是可以打印的,但是调用layui.layer或layui.form会报错)。所以在请求接口前,在ready函数里面重新使用layui.use()方法导入form组件

        奇怪问题2:

                在没有使用layui.use("form",function(){})导入组件的时候,页面上select的样式是原生样式,layui样式不会生效。

正文:(select 的使用方式)

<select id="zdName" lay-filter="zdFilter"><option value="">全部</option>
</select>
$(document).ready(function(){layui.use('form',function(){let form = layui.form;//获取部门departListFun()})
})
//获取部门数据接口
function departListFun() {$.ajax({url: rootPath + '/department/listDepartmentAll',type: 'get',dataType: 'json',success:function(data){if (data.length > 0) {let zdDom = document.getElementById("zdName")for(let i = 0; i < data.length; i++){let option = new Option(data[i].name,data[i].name)zdDom.add(option)}layui.form.render('select')//事件绑定layui.form.on("select(zdFilter)",function(data){//  重新获取数据depart = data.value//走接口画柱状图getDataByDepart()//下面柱状图进行联动getDataByType()})}}})
}

layui.form.render("select") 一定一定一定不能忘记!!! 

form.on("select(filter)",callback)

        select 为选择框事件固定名称

        filter 为选择框元素对应的 lay-filter 属性值

 

       

http://www.dtcms.com/a/272591.html

相关文章:

  • 图解Java数据容器(三):Queue
  • CAS登录工作流程简述
  • 【前端】【Echarts】ECharts 词云图(WordCloud)教学详解
  • Prompt提示词的主要类型和核心原则
  • 在vscode中和obsidian中使用Mermaid
  • Spring AI Alibaba(2)——通过Graph实现工作流
  • Flutter 与 Android 的互通几种方式
  • Linux 中 sed 命令
  • RedisJSON 路径语法深度解析与实战
  • Spring Boot + Javacv-platform:解锁音视频处理的多元场景
  • 【TCP/IP】12. 文件传输协议
  • MySQL索引操作全指南:创建、查看、优化
  • Debian-10编译安装Mysql-5.7.44 笔记250706
  • macOS 上安装 Miniconda + Conda-Forge
  • Jekyll + Chirpy + GitHub Pages 搭建博客
  • 如何使用Java WebSocket API实现客户端和服务器端的通信?
  • 蓝桥杯第十六届(2025)真题深度解析:思路复盘与代码实战
  • MinerU将PDF转成md文件,并分拣图片
  • Alibaba Druid主要配置
  • 图片合并pdf
  • 新手向:实现ATM模拟系统
  • TDengine 数据库建模最佳实践
  • Oracle 视图
  • Tomcat:Java Web应用的幕后英雄
  • 线性探针是什么:是一种用于探测神经网络中特定特征的工具
  • 从零开始搭建深度学习大厦系列-3.卷积神经网络基础(5-9)
  • 李宏毅(深度学习)--(2)
  • 数据库复合索引设计:为什么等值查询列应该放在范围查询列前面?
  • 区间动态规划详解
  • 【JMeter】跨线程组传递参数