layui 下拉列表触发事件 获取自定义属性

由于 layui 框架的覆盖性,我们是无法使用传统 jsjQuery 的写法的,比如: $("#toSelGoodsID").change(function(){)

  • html 核心代码:
<div class="layui-input-inline">
            <select id="toSelGoodsID" lay-filter="toSelGoodsID"
                    lay-verify="required" lay-search="">
                <option title="HELLO" value="0">直接选择或搜索选择</option>
                <option title="WORLD" value="1">WORLD</option>
                <option title="SORRY" value="2">SORRY</option>
            </select>
</div>
  • js 核心代码:
    layui.use(['form'], function () {
    	//必须要初始化 form
        var form = layui.form;
		/**
         * toSelGoodsID 下拉列表触发事件
         */
        form.on('select(toSelGoodsID)', function (data) {
        	//获取当前选中下拉项的索引
            var indexGID = data.elem.selectedIndex;
            //获取当前选中下拉项的自定义属性值 title
            var goodsName = data.elem[indexGID].title;
             //获取当前选中下拉项的 value值
            var goodsID = data.value;
            var appendStr = "<input type=\"checkbox\" name=\"aGoods[]\" value=\"" + goodsID + "\" lay-skin=\"primary\"\n" +
                "                   title=\"" + goodsName + "\" checked=\"\">";
            $(".div-actGoods").append(appendStr);
            form.render();
        });
        });

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券