設置select下拉框為不可修改的幾種方法：

因為select的特殊性，導致它不能像input表單一樣簡單地設置一個readonly來限制修改，所以，我們需要進行別的操作！

1、為下拉框添加樣式，可以禁用該下拉框(效果和敲地板差不多)：

<select name="name" id="select" class="select" style="pointer-events: none;"></select>

2、為下拉框添加onfocus和onchange方法，可以禁用該下拉框（點擊出來全部，但其他的就是不能選，誒~）：

<select name="name" id="select" class="select" οnfοcus="this.defaultIndex=this.selectedIndex;" οnchange="this.selectedIndex=this.defaultIndex;">

或者在js中

   	  	 var sel= document.getElementById('mySelect');sel.onchange=function(){this.selectedIndex=this.defaultIndex;};sel.onfocus=function(){this.defaultIndex=this.selectedIndex;};

3、可以在頁面加載之前設置，將select設置為disabled，需要注意：disabled屬性會使得值無法傳遞，所以需要在提交前取消disabled。（我虛了，你呢？）

$(function() {  $('#select').attr("disabled",true); }）；

或者

var sel= document.getElementById('mySelect');
sel.disabled="true";

需提交表單前設置

$('#select').attr("disabled",false);

或者

var sel= document.getElementById('mySelect');
sel.disabled="false";

4、使用js使select無法修改（實現方式是通過js把其他的選項一個一個清除）如下：（成功路上無對手！）

//獲取select對象
var iElement= document.getElementById('mySelect');
//新建一個下拉框數組
var optionTags = new Array();
var index = 0;
var optionObj;
//拿到目前select應該展示的元素value
var elementValue = iElement.value;
var tag;
//拿到當前所有的option 放在options(數組)中
var options = iElement.options;
if(options.length>1){for(var j = options.length-1; j >= 0; j--){tag = new Array();optionObj=options[j];tag["value"] = optionObj.value;tag["text"]  = optionObj.text;optionTags[index++] = tag;//如果該元素不是當前展示的元素，則將該元素移除if(tag["value"] != elementValue){iElement.remove(j);}}
}
//最后的select只剩一個元素，也就達到了效果

以上，希望能夠幫到你！

總結

以上是生活随笔為你收集整理的设置select下拉框不可修改的→“四”←种方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。