layui设置下拉框禁止输入

可以通过设置下拉框的 `readonly` 属性来禁止输入，示例代码如下：

<select name="select" lay-verify="required" readonly>
  <option value=""></option>
  <option value="1">选项1</option>
  <option value="2">选项2</option>
  <option value="3">选项3</option>
</select>

另外，如果需要动态设置下拉框的禁用状态，也可以使用 `disabled` 属性来实现，示例代码如下：

// 禁用下拉框
$("select[name='select']").attr("disabled", true);

// 启用下拉框
$("select[name='select']").attr("disabled", false);

相关问题

layui 热下拉框

layui 中的热下拉框是指在下拉框中输入关键字后，会根据关键字自动筛选出匹配的选项，并展示在下拉框中。实现这个功能需要使用 layui 的下拉框组件，同时结合一些 JavaScript 代码来实现动态筛选。以下是一个简单的示例：

HTML 代码：

<div class="layui-form-item">
  <label class="layui-form-label">城市</label>
  <div class="layui-input-inline">
    <select id="city" lay-filter="city">
      <option value="">请选择城市</option>
      <option value="beijing">北京</option>
      <option value="shanghai">上海</option>
      <option value="guangzhou">广州</option>
      <option value="shenzhen">深圳</option>
      <option value="hangzhou">杭州</option>
      <option value="chengdu">成都</option>
      <option value="wuhan">武汉</option>
    </select>
  </div>
</div>

JavaScript 代码：

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

  // 给下拉框绑定 input 事件，实现热下拉框功能
  $('#city').next().find('input').on('input', function() {
    var keyword = $(this).val();
    $('#city option').each(function() {
      if ($(this).text().indexOf(keyword) === -1) {
        $(this).hide();
      } else {
        $(this).show();
      }
    });
    form.render('select');
  });
});

在上述代码中，我们给下拉框绑定了 input 事件，当用户输入关键字时，遍历所有选项，如果选项的文本中不包含关键字，则隐藏该选项，否则显示该选项。最后调用 form.render('select') 方法重新渲染下拉框即可。

layui动态下拉框

layui是一个轻量级的前端UI库，它提供了一套简洁、易用的组件，包括下拉框（laySelect）。在layui中，动态下拉框是指通过JavaScript或者其API动态生成或更新下拉列表的选择项。通常，你可以这样做：

1. 初始化时，创建基本的laySelect元素：

layui.use('select', function(){
    var select = layui.select;
    // 创建静态下拉框
    var $select = select.render({
        elem: '#mySelect', // 选择绑定的DOM元素
        options: [{name: '选项1'}, {name: '选项2'}] // 初始选项
    });
});

2. 动态添加或删除选项：

function addOption(newOptions){
    $select.addOptions(newOptions); // 向下拉框追加新选项
}

function removeOption(index){
    $select.removeOption(index); // 删除指定索引的选项
}