layui切换select选项事件
说明
我们经常遇到表单上面选择不同的下拉选项需要触发函数去完成一些业务逻辑,比如我这个地方根据所选商品查询它底下明细的数量,并展示。
效果演示

代码
<!--选择商品-->
<div class="layui-form-item">
<label class="layui-form-label">商品</label>
<div class="layui-input-block">
<select id="goodsId" name="goodsId" lay-verify="required" lay-filter="goodsId">
<option value="">--选择商品--</option>
</select>
<div class="layui-unselect layui-form-select">
<div class="layui-select-title">
<input type="text" placeholder="请选择" value="" readonly=""
class="layui-input layui-unselect">
<i class="layui-edge"></i>
</div>
</div>
</div>
</div>
// 监听商品更改事件
form.on('select(goodsId)', function(e) {
$.ajax({
type: "GET",
url: ctx+'goods/kmtj/'+$("#goodsId").val(),
success: function (result) {
$('#kmtj').val('总计:'+result.data.total+'张|剩余:'+result.data.left+'张');
}
})
})
layui切换select选项事件的更多相关文章
- 使用layui的form.on绑定select选中事件, form.on()不执行的原因分析
使用layui的form.on绑定select选中事件中, form.on()不执行, 主要原因有 1, select标签中没有写lay_filter属性,用来监听 <select id=&qu ...
- layui中select实现二级关联
目的:实现店铺和仓库的二级关联,通过选择不同的店铺,来显示这个门店对应的库位信息. 1. 在select选项上添加lay-filter选择器. <div class="layui-in ...
- 动态获取后台传过来的值作为select选项
问题描述:点击左侧菜单项,进入对应的具体页面a.html,页面上方有个select框,点击框后,会浮现选择项. 解决思路:对左侧菜单项添加一个onclick事件,进入后台做具体的查询,将查询到的lis ...
- Jquery操作select选项集合,判断集合中是否存在option
转载:http://www.cnblogs.com/pepcod/archive/2012/07/03/JavaScript.html Query获取Select选择的Text和Value: 语法解释 ...
- jquery事件之select选中事件
根据select下拉列表选中的不同选项执行不同的方法,工作中经常会用到,这里就要用到Jquery的select选中事件 这里给select加一个叫label_id的id,然后通过id选择器找到这个节点 ...
- select 选项的子句
select 选项 : 关键字 all :全部(默认值)distinct:去掉重复的查询结果.语法:select all * from 表名: 别名: 关键字:as 语法:select * from ...
- js获取select改变事件
js获取select改变事件onchage前的值 和 onclick事件 <select id="wupin_id" name="wupin_id" on ...
- js 触发select onchange事件
select 或text的onchange事件需要手动(通过键盘输入)改变select或text的值才能触发,本文为大家介绍下使用js触发select onchange事件select 或text的o ...
- select change事件给其它元素赋值,本select的value或tex
select change事件给其它元素赋值,本select的value或textonchange='$("#areaname").val($("option:selec ...
- layui之select的option叠加问题解决
小编我在使用layui,在select的地方遇到了坑,select里的值居然无法清空,select里的option还有叠加问题,为了解决这个问题,也达到我的功能,我研究了下,让有同样需求的小伙伴不踩坑 ...
随机推荐
- [转帖]Unicode标准中定义的3个私有使用区域-一个基本区域+两个补充区域
Unicode私有使用区域 目录 1.概述 2.Unicode标准中的描述 2.1.基本多语言平面的私有区域 2.2.补充私有区域 2.3.私有区域位置 3.实际测试 3.1.测试代码 3.2.测试结 ...
- [转帖]Centos使用chrony做时间同步
https://www.cnblogs.com/lizhaoxian/p/11260041.html Chrony是一个开源的自由软件,在RHEL 7操作系统,已经是默认服务,默认配置文件在 /etc ...
- [转帖]如何使用 sed 命令删除文件中的行
https://zhuanlan.zhihu.com/p/80212245 sed 命令是 Linux 中的重要命令之一,在文件处理方面有着重要作用.可用于删除或移动与给定模式匹配的特定行.-- Ma ...
- [转帖]netperf - 网络测试工具
1. 概述 Netperf是一种网络性能的测量工具,主要针对基于TCP或UDP的传输.Netperf根据应用的不同,可以进行不同模式的网络性能测试,即批量数据传输(bulk data transfer ...
- [转帖]服务器稳定性测试-LTP压力测试方法及工具下载
简介 LTP(LinuxTest Project)是SGI.IBM.OSDL和Bull合作的项目,目的是为开源社区提供一个测试套件,用来验证Linux系统可靠性.健壮性和稳定性.LTP测试套件是测试L ...
- [转贴]Kubernetes之修改NodePort对外映射端口范围
https://www.cnblogs.com/minseo/p/12606326.html k8s默认使用NodePort对外映射端口范围是30000-50000可以通过修改kube-apiserv ...
- 最简单的以CentOS为base images 安装 Nodejs等操作的方法
镜像内安装NodeJS的简单方法 公司内有产品需要安装nodejs以便进行相关操作,Linux和Windows时没有问题,但是如果是镜像的话可能会稍微复杂一点, 这里简单进行一下总结, 以便备忘. 1 ...
- SUBMIT指定用户名错误
1.SUBMIT说明 在ABAP中,SUBMIT关键字用于运行另一个ABAP程序.通过SUBMIT关键字,可以在当前程序内部调用其他程序,而无需关闭当前程序. SUBMIT语句的一般语法如下: &qu ...
- vue动画 <transition-group> 使用半场动画
<style> /* 给动画添加一组过度效果 */ .v-enter, .v-leave-to { opacity: 0.8; /* 从右向左进入 */ transform: transl ...
- 【代码分享】使用 terraform, 在 ZeroSSL 上申请托管在 cloudflare 上的域名对应的证书
作者:张富春(ahfuzhang),转载时请注明作者和引用链接,谢谢! cnblogs博客 zhihu Github 公众号:一本正经的瞎扯 接上一篇:<使用 terraform, 在 Let' ...