layui input 监听事件
//监听表单单选框复选框选择
form.on('radio', function (data) {
console.log(data.value); //得到被选中的值
});
//监听表单下拉菜单选择
form.on('select', function (data) {
console.log(data.value); //得到被选中的值
});
//监听表单复选框选择
form.on('checkbox', function (data) {
console.log(data.value); //得到被选中的值
});
//监听表格复选框选择
table.on('checkbox(demo)', function (obj) {
console.log(obj);
});
//layui监听input内容变动简单粗暴
$(function(){
//输入框的值改变时触发
$("#inputid").on("input",function(e){
//获取input输入的值
console.log(e.delegateTarget.value);
});
});
//点击触发监听
$(document).on('click','.class',function(othis){
var data = othis.currentTarget;
data.remove();
layer.msg('清除成功');
});
带注释
form.on('event(过滤器值)', callback);
//监听checkbox复选
form.on('checkbox(filter)', function(data){
console.log(data.elem); //得到checkbox原始DOM对象
console.log(data.elem.checked); //是否被选中,true或者false
console.log(data.value); //复选框value值,也可以通过data.elem.value得到
console.log(data.othis); //得到美化后的DOM对象
});
//监听switch复选
form.on('switch(filter)', function(data){
console.log(data.elem); //得到checkbox原始DOM对象
console.log(data.elem.checked); //开关是否开启,true或者false
console.log(data.value); //开关value值,也可以通过data.elem.value得到
console.log(data.othis); //得到美化后的DOM对象
});
//监听radio单选:
form.on('radio(filter)', function(data){
console.log(data.elem); //得到radio原始DOM对象
console.log(data.elem.dataset);//获取dataset参数
console.log(data.value); //被点击的radio的value值
});
//监听submit提交:
<button lay-submit lay-filter="*">提交</button>
form.on('submit(*)', function(data){
console.log(data.elem) //被执行事件的元素DOM对象,一般为button对象
console.log(data.form) //被执行提交的form对象,一般在存在form标签时才会返回
console.log(data.field) //当前容器的全部表单字段,名值对形式:{name: value}
return false; //阻止表单跳转。如果需要表单跳转,去掉这段即可。
});
监听Select的改变
<!-- 不用form 用div也可以 -->
<form class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">下拉选择框</label>
<div class="layui-input-block">
<select name="interest" lay-filter="aihao">
<option value="0">写作</option>
<option value="1">阅读</option>
<option value="2">听歌</option>
<option value="4">游戏</option>
</select>
</div>
</div>
</form>
<script type="text/javascript" src="./layui/layui.js"></script>
<script type="text/javascript">
layui.use('form', function(){
var form = layui.form;
form.on('select(aihao)',function(data){
console.log(data);
console.log(data.elem); //得到select原始DOM对象
console.log(data.value); //得到被选中的值
console.log(data.othis); //得到美化后的DOM对象
console.log(data.elem.dataset);//获取dataset参数
});
});
相关文章:
layui input 监听事件
//监听表单单选框复选框选择 form.on(radio, function (data) { console.log(data.value); //得到被选中的值 }); //监听表单下拉菜单选择 form.on(select, function (data) { console.log(data.value); //得到被选中的值 }); //监听表单复选框选择 …...
一致性思维链(SELF-CONSISTENCY IMPROVES CHAIN OF THOUGHT REASONING IN LANGUAGE MODELS)
概要 思维链已经在很多任务上取得了非常显著的效果,这篇论文中提出了一种 self-consistency 的算法,来代替 贪婪解码 算法。本方法通过 采样多个思维链集合,然后LLM模型生成后,选择一个最一致的答案作为最后的结果。一致性思维链…...
腾讯云16核服务器配置大全_16核CPU型号性能测评
腾讯云16核CPU服务器有哪些配置可以选择?可以选择标准型S6、标准型SA3、计算型C6或标准型S5等,目前标准型S5云服务器有优惠活动,性价比高,计算型C6云服务器16核性能更高,轻量16核32G28M带宽优惠价3468元15个月…...
HTML中Input elements should have autocomplete attributes的解决方案
kwfwservice.php:1 [DOM] Input elements should have autocomplete attributes (suggested: “current-password”): (More info: https://goo.gl/9p2vKq) <input name"password" id"password" lay-verify"required" placeholder"密码&…...
2808. 使循环数组所有元素相等的最少秒数;1015. 可被 K 整除的最小整数;1001. 网格照明
2808. 使循环数组所有元素相等的最少秒数 核心思想:枚举每个元素作为相等元素最多需要多少秒,然后维护它的最小值。最多需要多少秒是怎么计算的,我们可以把相等值的下标拿出来,然后你会发现两个相邻下标(相邻下标只的…...
Python爬虫在Web应用自动化测试中的应用
在Web应用开发过程中,自动化测试是确保应用质量和稳定性的重要环节。本文将介绍如何使用Python爬虫与自动化测试技术相结合,实现对Web应用进行自动化测试的方法和步骤。通过这种结合,我们可以提高测试效率、减少人力成本,并确保应…...
苹果手机短信删除了怎么恢复?3种有效方法介绍
手机短信是一种即时通信方式,人们可以使用短信来达到快速传递信息的目的。在没有网络或者网络不稳定的时候,短信仍然可以做到发送和接收,这弥补了其他网络通信软件的缺点。 所以说,手机短信仍然是我们生活中不可缺少的一部分。当…...
前端JavaScript中的 == 和 ===区别,以及他们的应用场景,快来看看吧,积累一点知识。
🎬 江城开朗的豌豆:个人主页 🔥 个人专栏 :《 VUE 》 《 javaScript 》 ⛺️ 生活的理想,就是为了理想的生活 ! 目录 一、等于操作符 二、全等操作符 三、区别 小结 一、等于操作符 等于操作符用两个等于号( &am…...
文献阅读:LIMA: Less Is More for Alignment
文献阅读:LIMA: Less Is More for Alignment 1. 内容简介2. 实验设计 1. 整体实验设计2. 数据准备3. 模型准备4. metrics设计 3. 实验结果 1. 基础实验2. 消解实验3. 多轮对话 4. 结论 & 思考 文献链接:https://arxiv.org/abs/2305.11206 1. 内容简…...
机器学习第十四课--神经网络
总结起来,对于深度学习的发展跟以下几点是离不开的: 大量的数据(大数据)计算资源(如GPU)训练方法(如预训练) 很多时候,我们也可以认为真正让深度学习爆发起来的是数据和算力,这并不是没道理的。 由于神经网络是深度学习的基础,学…...
React(react18)中组件通信04——redux入门
React(react18)中组件通信04——redux入门 1. 前言1.1 React中组件通信的其他方式1.2 介绍redux1.2.1 参考官网1.2.2 redux原理图1.2.3 redux基础介绍1.2.3.1 action1.2.3.2 store1.2.3.3 reducer 1.3 安装redux 2. redux入门例子3. redux入门例子——优…...
最新AI创作系统+ChatGPT网站源码+支持GPT4.0+支持ai绘画+支持国内全AI模型
一、AI创作系统 SparkAi系统是基于很火的GPT提问进行开发的Ai智能问答系统。本期针对源码系统整体测试下来非常完美,可以说SparkAi是目前国内一款的ChatGPT对接OpenAI软件系统。那么如何搭建部署AI创作ChatGPT系统?小编这里写一个详细图文教程吧&#x…...
react+umi项目中引入antd组件报错:“Button”不能用作 JSX 组件解决方案
具体报错信息 “Button”不能用作 JSX 组件。 Its type ‘(props: IProps) > React.ReactElement’ is not a valid JSX element type. 不能将类型“(props: IProps) > React.ReactElement”分配给类型“(props: any, deprecatedLegacyContext?: any) > ReactNode”。…...
常用算法模板
目录 快读、快输 快读、快输 #include <cstdio> #define Re register int #define LD double// 读整数 inline void in(Re &x) {int f 0; x 0; char c getchar();while (c < 0 || c > 9) f | c -, c getchar();while (c > 0 && c < 9) x …...
最全跨境独立站建站详细步骤解析
对于跨境电商卖家来说,无论是规避“鸡蛋放在同一个篮子里”的风险,还是追求更多的销售额和利润,多平台、多站点的布局都是其至关重要的战略。加之市场的变化带来了新的发展机遇,这也使得如今很多出海企业都在抢占独立站新风口。然…...
提升群辉AudioStation音乐体验,实现公网音乐播放
文章目录 本教程解决的问题是:按照本教程方法操作后,达到的效果是本教程使用环境:1 群晖系统安装audiostation套件2 下载移动端app3 内网穿透,映射至公网 很多老铁想在上班路上听点喜欢的歌或者相声解解闷儿,于是打开手…...
虹科分享 | 谷歌Vertex AI平台使用Redis搭建大语言模型
文章来源:虹科云科技 点此阅读原文 基础模型和高性能数据层这两个基本组件始终是创建高效、可扩展语言模型应用的关键,利用Redis搭建大语言模型,能够实现高效可扩展的语义搜索、检索增强生成、LLM 缓存机制、LLM记忆和持久化。有Redis加持的大…...
VS Code 代码跳转到定义(.js 和 .vue文件跳转)
vscode 代码跳转到定义(.js 和 .vue文件跳转) 在日常的开发工作中,我们经常需要跳转到方法或变量的定义处,以便更好地理解和修改代码。VS Code 是目前比较流行的开发工具,然而它默认情况下并不支持这个功能,…...
华为云云耀云服务器L实例评测 | Docker 部署 Reids容器
文章目录 一、使用Docker部署的好处二、Docker 与 Kubernetes 对比三、云耀云服务器L实例 Docker 部署 Redis四、可视化工具连接Redis⛵小结 一、使用Docker部署的好处 Docker的好处在于:在不同实例上运行相同的容器 Docker的五大优点: 持续部署与测试…...
聚观早报 | 杭州亚运开幕科技感拉满;腾讯官宣启动「青云计划」
【聚观365】9月25日消息 杭州亚运开幕科技感拉满 腾讯官宣启动「青云计划」 FF任命新全球CEO 比亚迪夺得多国销冠 iPhone 15/15 Pro销售低于预期 杭州亚运开幕科技感拉满 杭州第19届亚洲运动会开幕式23日晚在杭州奥体中心主体育馆举行,这届开幕式可谓科技感拉…...
如何用douyin-downloader免费批量下载抖音视频:完整指南
如何用douyin-downloader免费批量下载抖音视频:完整指南 【免费下载链接】douyin-downloader A practical Douyin downloader for both single-item and profile batch downloads, with progress display, retries, SQLite deduplication, and browser fallback sup…...
碧蓝航线自动化工具使用指南
碧蓝航线自动化工具使用指南 【免费下载链接】AzurLaneAutoScript Azur Lane bot (CN/EN/JP/TW) 碧蓝航线脚本 | 无缝委托科研,全自动大世界 项目地址: https://gitcode.com/gh_mirrors/az/AzurLaneAutoScript 一、工具概述 碧蓝航线自动化工具是一款功能强…...
WuliArt Qwen-Image Turbo实战:快速生成赛博朋克壁纸,效果惊艳
WuliArt Qwen-Image Turbo实战:快速生成赛博朋克壁纸,效果惊艳 1. 引言:当AI绘画遇见赛博朋克 你是否曾经幻想过,只需输入一段文字描述,就能立即获得一张充满未来感的赛博朋克风格壁纸?过去,这…...
Pixel Dimension Fissioner 商业设计案例:为品牌生成动态视觉识别系统素材
Pixel Dimension Fissioner 商业设计案例:为品牌生成动态视觉识别系统素材 1. 动态视觉识别的数字革命 当品牌视觉从静态纸张跃入数字屏幕,传统VI手册里的规范条款突然显得力不从心。去年某国际饮料品牌做过一项调研:在Instagram上…...
千问3.5-9B镜像+OpenClaw:10分钟搭建云端自动化测试环境
千问3.5-9B镜像OpenClaw:10分钟搭建云端自动化测试环境 1. 为什么选择云端部署OpenClaw 去年我在本地折腾OpenClaw时,光是解决Python环境冲突就花了两天时间。最近发现星图平台提供了千问3.5-9B和OpenClaw的预置镜像组合,实测从创建实例到运…...
基于Uniapp + SpringBoot + Vue的智能停车场管理系统(角色:用户、员工、管理员)
文章目录前言一、详细操作演示视频二、具体实现截图三、技术栈1.前端-Vue.js2.后端-SpringBoot3.数据库-MySQL4.系统架构-B/S四、系统测试1.系统测试概述2.系统功能测试3.系统测试结论五、项目代码参考六、数据库代码参考七、项目论文示例结语前言 💛博主介绍&#…...
OpenClaw隐私保护方案:Qwen3-14b_int4_awq本地化数据处理优势
OpenClaw隐私保护方案:Qwen3-14b_int4_awq本地化数据处理优势 1. 为什么我们需要关注AI自动化中的隐私问题 去年我帮朋友的公司评估一个自动化方案时,遇到一个典型场景:他们需要处理大量客户合同,但担心使用云端AI服务会导致敏感…...
Linux系统下VMware虚拟机磁盘空间扩展实战:从40G到60G的详细步骤
Linux系统下VMware虚拟机磁盘空间扩展实战:从40G到60G的详细步骤 当你在Linux环境中使用VMware虚拟机时,磁盘空间不足可能是最令人头疼的问题之一。尤其是当根目录即将耗尽空间时,系统性能会急剧下降,甚至导致关键服务崩溃。作为一…...
OpenClaw+SecGPT-14B组合方案:5步搭建个人安全运营中心
OpenClawSecGPT-14B组合方案:5步搭建个人安全运营中心 1. 为什么需要个人安全运营中心 去年我的家庭实验室遭遇了一次未遂的入侵尝试。当时我正在外地出差,NAS上的异常登录提醒被淹没在几百条通知里。这件事让我意识到:安全监控不能只依赖碎…...
无线通信开发者的硬件加速指南:在Vivado里用System Generator快速搭建信道仿真原型
无线通信硬件加速实战:从Simulink到FPGA的信道仿真全流程解析 在当今5G/6G通信、物联网和自动驾驶技术快速发展的背景下,无线通信系统的复杂度和性能要求呈指数级增长。传统基于通用处理器的软件仿真方法已难以满足实时性要求,而FPGA凭借其并…...
