layui获取select选中的值的代码参考

2023-10-08实例代码
736

layui如何获取select选中的值,下面代码为您实现layui table中获取select选中值
 <select name="region" lay-filter="region-dropdown">
    <option value="ap-chengdu">成都</option>
    <option value="ap-nanjing">南京</option>
    <option value="ap-beijing-1">北京一区</option>
    <option value="ap-beijing">北京</option>
    <option value="ap-guangzhou">广州</option>
    <option value="ap-shanghai">上海</option>
    <option value="ap-chongqing">重庆</option>
</select>
 
//用 jquery 获取 select 选中的值:
 
layui.use(['form'], function(){
    var $ = layui.$
    ,form = layui.form;
 
    var region = $("select[name='region']").val();
    console.log(region);
    // ap-chengdu
})

//监听 select 选择来获取 select 选中的值:
 
layui.use(['form'], function(){
    var $ = layui.$
    ,form = layui.form;
 
    //监听地区下拉
    form.on('select(region-dropdown)', function(data){
        console.log(data.elem); //得到select原始DOM对象
        console.log(data.value); //得到被选中的值
        console.log(data.othis); //得到美化后的DOM对象
    })
    // ap-chengdu
})
 
The End

相关推荐

layui后台布局实例代码
layui后台布局的实例代码,以下是详细代码: !DOCTYPE htmlhtmlhead meta charset="utf-8" meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" titlelayout 后台大布局 - Layui/title link rel="stylesheet" ...
2025-10-15 实例代码
68

可自动切换的tab实例代码
可自动切换的tab实例代码,html代码如下: !-- tab标签代码begin --div class="tab1" id="tab1" div class="menu" ul li id="one1" onclick="setTab('one',1)"新闻/li li id="one2" onclick="setTab('one',2)"活动/li li id="one3" onclick="setTab('one',3)"...
2025-09-16 实例代码
114

php数据处理:数组根据某字段进行分组
php数据处理:数组根据某字段进行分组,实例代码如下: /** * @description:根据数据 * @param {dataArr:需要分组的数据;keyStr:分组依据} * @return: */ protected function dataGroup(array $dataArr,string $keyStr) :array { $newArr=[]; foreach ($data...
2025-06-12 实例代码
188

LayUI登录页面页设计实例
实例代码如下: !DOCTYPE htmlhtml lang="en" head meta charset="utf-8" link rel="stylesheet" href="layui/css/layui.css" style type="text/css" .container{ width: 420px; height: 320px; min-height: 320px; max-height: 320px; position: absolute; t...
2025-04-13 实例代码
234

MUI Picker Input设置默认时间回显实例代码
MUI Picker Input设置默认时间回显实例代码 mui('body').on('tap', '#begTime', function () { //日期选择 var dtPicker = new mui.DtPicker({ type: 'date' }); /*参数:'datetime'-完整日期视图(年月日时分) 'date'--年视图(年月日) 'time' --时间视图(时分...
2025-01-09 实例代码
139

layui实现带清除按钮的输入框
layui实现带清除按钮的输入框,首先html文件如下: !DOCTYPE htmlhtmlhead meta charset="utf-8" meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" title测试 - layui/title link rel="stylesheet" href="layui/css/lay...
2024-12-31 实例代码
200