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

Layui---输入事件

输入实时监听 

//监听表单单选框复选框选择
form.on('radio', function (data) {console.log(data.value); //得到被选中的值
});//监听表单下拉菜单选择form.on('select', function (data) //监听表单下拉菜单选择form.on('select', function (data) 
​
//监听表单复选框选择form.on('checkbox', function (data)//监听表格复选框选择
table.on('checkbox(demo)', //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或者falseconsole.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或者falseconsole.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; //阻止表单跳转。如果需要表单跳转,去掉这段即可。
});

输入选择后事件

//监听模具分摊单位的输入框变化(输入后)$('#apportion_unit').blur(function(event) {var apportionUnit = $(this).val();$('#total_quantity').text(apportionUnit);//赋值});

 

http://www.lryc.cn/news/406987.html

相关文章:

  • 甄选范文“论软件测试中缺陷管理及其应用”软考高级论文,系统架构设计师论文
  • spring框架实现滑动验证码功能
  • Pytorch使用教学8-张量的科学运算
  • [Spring Boot]登录密码三种加密方式
  • 前端面试项目细节重难点分享(十三)
  • 每天五分钟深度学习:向量化方式完成逻辑回归m个样本的前向传播
  • 以线程完成并发的UDP服务端
  • linux c 特殊字符分割
  • 搭建本地私有知识问答系统:MaxKB + Ollama + Llama3 (wsl网络代理配置、MaxKB-API访问配置)
  • 谷粒商城实战笔记-65-商品服务-API-品牌管理-表单校验自定义校验器
  • 学好C++之——命名空间
  • pytorch lightning报错all tensors to be on the same device
  • Redis中的哨兵(Sentinel)
  • 产业创新研究杂志产业创新研究杂志社产业创新研究编辑部2024年第12期目录
  • 网闸(Network Gatekeeper或Security Gateway)
  • C#中的字符串
  • docker安装部署elasticsearch7.15.2
  • Symfony 入门指南:快速安装与基础配置
  • 3.3V升压至5V的AH6922芯片:高效能的SOP8封装解决方案
  • 赋能未来教育,3DCAT助力深圳鹏程技师学院打造5G+XR实训室
  • 力扣141环形链表问题|快慢指针算法详细推理,判断链表是否有环|龟兔赛跑算法
  • React 常见的报错及解决方法
  • 更新服务器nginx 1.26.1版本
  • JAVA代码审计JAVA0基础学习(需要WEB基础知识)DAY2
  • SpringBoot整合elasticsearch-java
  • 网络服务与应用
  • Git项目如何配置,如何上传至GitHub
  • Python教程(一):环境搭建及PyCharm安装
  • 神经网络与注意力机制的权重学习对比:公式探索
  • C语言------指针讲解(3)