layui写一个二级联动下拉的样例

好的，以下是一个layui二级联动下拉的示例代码：

HTML代码：

<div class="layui-form-item">
  <label class="layui-form-label">省份</label>
  <div class="layui-input-block">
    <select name="province" lay-filter="province">
      <option value="">请选择省份</option>
      <option value="广东省">广东省</option>
      <option value="湖北省">湖北省</option>
      <option value="浙江省">浙江省</option>
    </select>
  </div>
</div>

<div class="layui-form-item">
  <label class="layui-form-label">城市</label>
  <div class="layui-input-block">
    <select name="city" lay-filter="city">
      <option value="">请选择城市</option>
    </select>
  </div>
</div>

JavaScript代码：

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

  // 监听省份下拉框的变化
  form.on('select(province)', function (data) {
    var province = data.value;
    var citySelect = $('select[name="city"]');

    // 根据省份动态生成城市下拉框选项
    if (province === '广东省') {
      citySelect.html('<option value="">请选择城市</option><option value="广州市">广州市</option><option value="深圳市">深圳市</option><option value="珠海市">珠海市</option>');
    } else if (province === '湖北省') {
      citySelect.html('<option value="">请选择城市</option><option value="武汉市">武汉市</option><option value="宜昌市">宜昌市</option><option value="襄阳市">襄阳市</option>');
    } else if (province === '浙江省') {
      citySelect.html('<option value="">请选择城市</option><option value="杭州市">杭州市</option><option value="宁波市">宁波市</option><option value="温州市">温州市</option>');
    } else {
      citySelect.html('<option value="">请选择城市</option>');
    }

    // 重新渲染城市下拉框
    form.render('select');
  });

  // 监听城市下拉框的变化
  form.on('select(city)', function (data) {
    console.log('选择的城市是：', data.value);
  });
});

以上代码实现了一个简单的二级联动下拉框，当选择省份时，动态生成对应的城市选项。当选择城市时，会在控制台输出选择的城市名称。希望能够帮到你！