✨ layui绑定联动下拉框 🌟

在前端开发中，使用layui框架实现联动下拉框是一种常见的需求。例如，当用户选择省份时，城市列表会自动更新。首先，确保引入了layui的相关文件，然后通过简单的代码实现这一功能。例如：

```html

请选择省份

北京

上海

请选择城市

```

接着，在JavaScript中配置监听器：

```javascript

layui.use(['form'], function(){

var form = layui.form;

// 监听省份变化

form.on('select(province)', function(data){

var provinceId = data.value;

if(provinceId == '1'){

cityList = ['东城', '西城'];

} else if(provinceId == '2'){

cityList = ['黄浦', '徐汇'];

}

// 更新城市选项

var citySelect = document.getElementById('city');

citySelect.innerHTML = '请选择城市';

cityList.forEach(function(city){

var option = document.createElement('option');

option.value = city;

option.text = city;

citySelect.add(option);

});

layui.form.render('select'); // 重新渲染表单

});

});

```

这样，当用户选择不同的省份时，城市下拉框会动态更新，提升用户体验。💡 这种方法简单高效，是前端开发中的实用技巧之一。