这是最简单、最好的解决办法。 您将在您的选择上设置一个readolny属性，或任何其他属性，如data-readonly，并执行以下操作

$("select[readonly]").live("focus mousedown mouseup click",function(e){
    e.preventDefault();
    e.stopPropagation();
});

我们还可以禁用除所选选项之外的所有选项。

这样，下拉菜单仍然可以工作(并提交其值)，但用户不能选择其他值。

Demo

<选择> <选项禁用> 1 > < /选项 <选项> 2 > < /选项 <选项禁用> 3 < /选项> < /选择>

<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。

使用tabindex解决方案。适用于选择和文本输入。

简单地使用.disabled类。

CSS:

.disabled {
    pointer-events:none; /* No cursor */
    background-color: #eee; /* Gray background */
}

JS:

$(".disabled").attr("tabindex", "-1");

HTML:

<select class="disabled">
    <option value="0">0</option>
</select>

<input type="text" class="disabled" />

编辑:使用Internet Explorer，你还需要这个JS:

$(document).on("mousedown", ".disabled", function (e) {
    e.preventDefault();
});

给select元素添加readOnly属性的另一种方法是使用css

你可以这样做:

$('#selection').css('pointer-events','none');

DEMO

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

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