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

文章来源：https://blog.csdn.net/u011415782/article/details/88916017

由于 layui 框架的覆盖性，我们是无法使用传统 js、jQuery 的写法的，比如： $("#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();
        });
        }）；