layui框架使用 xmselect 数据异步加载，可搜索数据 监听选择动作

在使用Layui框架中的xm-select组件进行数据的异步加载时，可以设置其为可搜索的选择框，并且可以通过监听选择动作来响应用户的选择。以下是一个简单的示例代码：

HTML部分：

<div id="demo1"></div>

JavaScript部分：

layui.use('xmSelect', function () {
    var xmSelect = layui.xmSelect;
 
    var xmSelectDemo = xmSelect.render({
        el: '#demo1', 
        autoRow: true,
        toolbar: { show: true },
        filterable: true, // 可搜索
        remoteSearch: true, // 开启远程搜索
        remoteMethod: function (value, callback) {
            // 模拟远程数据请求
            setTimeout(function () {
                var data = [{name: '选项1', value: '1'}, {name: '选项2', value: '2'}]; // 模拟数据
                // 这里可以是Ajax请求远程数据
                callback(data); // 回调函数，返回数据
            }, 500);
        },
        on: function (data) {
            if (data.event === 'select') { // 监听选择动作
                console.log(data.item); // 输出被选中的项
            }
        }
    });
});

在这个示例中，xm-select组件被设置为可搜索的，当用户输入搜索关键字时，会通过remoteMethod函数进行远程数据的加载。这个函数中可以执行Ajax请求，加载数据后通过回调函数callback返回给xm-select组件。on函数用于监听用户的选择动作，当用户选择某个选项时，会触发并输出被选中的项。