输入为<select>元素:

input.querySelectorAll(':not([selected])').forEach(option => {
  option.disabled = true
})

这将保留数据中的选择(因为它没有被禁用)，并且只有未被选中的选项是禁用的，因此是不可选的。 结果是一个不可更改的可读选择(=>只读)。

(简单的解决方案)

由于OP特别要求他不想禁用select元素，下面是我用来使select变为只读的方法

在html中

<select style="pointer-events: none;" onclick="return false;" onkeydown="return false;" ></select>

就是这样

解释

将pointer-events设置为none将禁用使用鼠标/光标事件编辑“select-element” 设置onclick和onkeydown函数返回false将禁用使用键盘编辑“select-element”

通过这种方式，您不必创建任何额外的元素，或使用javascript禁用/重新启用元素，或打乱表单提交逻辑，或使用任何第三方库。

此外，您可以轻松地添加css样式，如设置背景颜色为灰色或文本颜色为灰色，以暗示该元素是只读的。我没有将它添加到代码中，因为它非常特定于您的站点主题

或者你想通过javascript来实现

let isReadOnly = true; selectElement。Onclick = function () { isReadOnly; }; selectElement。onkeydown = function () { isReadOnly; }; selectElement.style.pointerEvents = isReadOnly ?“none”:“全部”;

输入为<select>元素:

input.querySelectorAll(':not([selected])').forEach(option => {
  option.disabled = true
})

这将保留数据中的选择(因为它没有被禁用)，并且只有未被选中的选项是禁用的，因此是不可选的。 结果是一个不可更改的可读选择(=>只读)。

<select id="countries" onfocus="this.defaultIndex=this.selectedIndex;" onchange="this.selectedIndex=this.defaultIndex;">
<option value="1">Country1</option>
<option value="2">Country2</option>
<option value="3">Country3</option>
<option value="4">Country4</option>
<option value="5">Country5</option>
<option value="6">Country6</option>
<option value="7" selected="selected">Country7</option>
<option value="8">Country8</option>
<option value="9">Country9</option>
</select>

测试和工作在IE 6, 7和8b2, Firefox 2和3,Opera 9.62, Safari 3.2.1 for Windows和谷歌Chrome。

    var selectedOpt;//initialize var
    var newIdForHidden;//initialize var
    $('.disabledOnEdit').focusin(function(){
        selectedOpt = $(this).find(":selected").val();
        newIdForHidden = $(this).attr('id')+'Hidden';
        //alert(selectedOpt+','+newIdForHidden);
        $(this).append('');
        $(this).find('input.hiddenSelectedOpt').attr('id',newIdForHidden).val(selectedOpt);
    });
    $('.disabledOnEdit').focusout(function(){
        var oldSelectedValue=$(this).find('input.hiddenSelectedOpt').val();
        $(this).val(oldSelectedValue);
    });

有同样的问题，并发现非常有用的属性表单提交禁用控件。

将其设置为True，禁用的输入现在是POST。