首頁 > 文章 > web前端 > css怎麼設定不可編輯

css怎麼設定不可編輯

藏色散人原創: 2021-03-02 10:09:245197瀏覽

css設定不可編輯的方法：1、透過readonly屬性規定輸入欄位為唯讀實作不可編輯。 2.透過disabled屬性規定停用input元素實作不可編輯。

css怎麼設定不可編輯

本文操作環境：Windows7系統、HTML5&&CSS3版、Dell G3電腦。

css設定不可編輯：

1、css透過readonly屬性規定輸入欄位為唯讀實作不可編輯：

<html>
<body>
<form action="/example/html/form_action.asp" method="get">
  
  <p>Name:<input type="text" name="email" /></p>
  <p>Country:<input type="text" name="country" 
  value="China" readonly="readonly" /></p>
  
  <input type="submit" value="Submit" />
</form>
<p>请在提交按钮上单击，输入会发送到服务器上名为 "form_action.asp" 的页面。</p>
</body>
</html>

效果圖：

css怎麼設定不可編輯

【推薦學習：css影片教學】

2、透過disabled屬性規定應該停用input元素實作不可編輯

<html>
<body>
<form action="/example/html/form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" disabled="disabled" /></p>
  <input type="submit" value="Submit" />
</form>
<p>请在提交按钮上单击，输入会发送到服务器上名为 "form_action.asp" 的页面。</p>
</body>
</html>

效果圖：

css怎麼設定不可編輯

disabled 屬性：

disabled 屬性規定應該停用input 元素。

被停用的 input 元素既不可用，也不可點選。可以設定 disabled 屬性，直到滿足某些其他的條件為止（例如選擇了一個複選框等等）。然後，就需要透過 JavaScript 來刪除 disabled 值，將 input 元素的值切換為可用。

readonly 屬性：

readonly 屬性規定輸入欄位為唯讀。

只讀欄位是不能修改的。不過，使用者仍然可以使用 tab 鍵切換到該字段，也可以選取或拷貝其文字。

readonly 屬性可以防止使用者對值進行修改，直到滿足某些條件為止（例如選取了一個複選框）。然後，需要使用 JavaScript 消除 readonly 值，將輸入欄位切換到可編輯狀態。

readonly 屬性可與或搭配使用。

以上是css怎麼設定不可編輯的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

看更多