html如何設定標籤input文字方塊爲只讀？

html中的input用處很廣泛，尤其是當我們在網頁開發中需要用到表單的時候。這裏我們看看有哪些方法讓input標籤不可編輯。

操作方法

（01）我們創建一個html5頁面，添加如下圖所示input標籤。創建過程我就不說了，Ctrl+n即可，這裏我們創建的是H5的頁面，當然，h4的也行。

（02）然後我們在Dreamweaver中切換爲實時視圖。右側頁面預覽中的標籤input中，我們可以看到，鼠標遊標還是可以在上面進行編輯的。

（03）接下來我們把鼠標遊標放到input標籤代碼中間即可，然後就可以看到Dreamweaver下方出現input標籤的屬性編輯選項了。如下圖，我們把只讀勾選即可。然後我們就可以看到input標籤代碼裏面出現了一個readonly，這裏我們也可以直接添加這個屬性到代碼中的。這時候，我們再看，input輸入框已經不能輸入了。

（04）然後我們再看看另一種方式，就是把input設定爲禁用，和剛纔的只讀一樣，我們勾選禁用即可，如下圖，input輸入框不能進行輸入了。

（05）第三種方式，我們還可以設定輸入框的焦點事件，如下圖，把焦點事件設定成鼠標模糊動作，就可以讓輸入框獲取不到焦點了，自然就無法編輯了。

（06）最後，我們把整體的幾個方法放到一起看看。如下圖。

特別提示

input輸入框只讀屬性根據需要按不同方法設定