其實就是利用了鼠標事件和去焦點功能。

以select下拉框為例：

οnmοuseοut="this.releaseCapture();">

value="optionValue">下拉框文字

onmousemove:鼠標在下拉框范圍內活動時觸發，調用setCapture函數讓span捕獲鼠標指針，從而阻止select相應鼠標事件。

onmouseout:鼠標離開下拉框時將鼠標指針的捕獲還給當前頁面。

onfocus:當select下拉框變成當前焦點時，取消它的焦點。

如果想在JS腳本中實現只讀和取消：

加鎖：

document.getElementByIdx_x("spanID").onmousemove = function()

{this.setCapture();};

document.getElementByIdx_x("spanID").onmouseout = function()

{this.releaseCapture();};

document.getElementByIdx_x("selectID").onfocus = function()

{this.blur();};

解鎖：

document.getElementByIdx_x("spanID").οnmοusemοve="";

document.getElementByIdx_x("spanID").οnmοuseοut="";

document.getElementByIdx_x("selectID").οnfοcus="";

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的html下拉框只读,HTML元素（如select下拉框）设置为只读的全部內容，希望文章能夠幫你解決所遇到的問題。

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