国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

奇技淫巧:css實現整個表單只讀 form readonly

時飛 / 2957人閱讀

摘要:此處就不一一贅述。我說的方法只需要給表單加上一個類,就可以讓表單只讀。方法用給做個看不見的蒙版,遮住下面所有的元素,使之不響應任何事件方法用讓所有事件穿透關于屬性,可以看看這個介紹

一般的方法往往給表單的各個input、select等加上readonly,但是這個方法有很多缺點。此處就不一一贅述。

我說的方法只需要給表單加上一個類,就可以讓表單只讀。

方法1: 用:before給form做個看不見的蒙版,遮住下面所有的元素,使之不響應任何事件
.form-readonly{
    position: relative;
}
.form-readonly:before{
    content: "";
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
方法2: 用pointer-events:none, 讓所有事件穿透form
.form-readonly{
    pointer-events:none;
}

關于pointer-events屬性,可以看看這個介紹:https://segmentfault.com/a/11...

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/91822.html

相關文章

  • 奇技淫巧css實現整個表單只讀 form readonly

    摘要:此處就不一一贅述。我說的方法只需要給表單加上一個類,就可以讓表單只讀。方法用給做個看不見的蒙版,遮住下面所有的元素,使之不響應任何事件方法用讓所有事件穿透關于屬性,可以看看這個介紹 一般的方法往往給表單的各個input、select等加上readonly,但是這個方法有很多缺點。此處就不一一贅述。 我說的方法只需要給表單加上一個類,就可以讓表單只讀。 方法1: 用:before給fo...

    impig33 評論0 收藏0
  • 表單readonly的input等標簽,禁止光標進入(focus)的幾種方式

    摘要:需求及問題描述在做移動端頁面,需要在訂單頁面中顯示表單數據,由于統一,所以就依舊采用的結構來寫結構,只讀數據的標簽自然要加,以為這樣就行了。測試中模擬移動端是看不出問題的。除此之外都表現完美,就我目前需求來看,也不需要什么事件。 需求及問題描述 在做移動端頁面,需要在訂單頁面中顯示表單數據,由于UI統一,所以就依舊采用form的結構來寫結構,只讀數據的標簽自然要加readonly=re...

    Lowky 評論0 收藏0
  • HTMl基礎

    摘要:每個表格均有若干行由標簽定義,每行被分割為若干單元格由標簽定義。字母指表格數據,即數據單元格的內容。數據單元格可以包含文本圖片列表段落表單水平線表格等等。表格最重要的目的是顯示表格類數據。規定在提交表單時所用的方法默認。 import socket def main(): sock = socket.socket(socket.AF_INET, socket.SOCK_STRE...

    番茄西紅柿 評論0 收藏0
  • CSS學習筆記(十) 界面組件之表單

    摘要:概述表單與其他頁面元素的作用不同。屬性用于指定服務器上用來處理表單數據的文件的。所謂控件,是對表單中用來收集數據的各種表單組件的通稱,包括文本框復選框單選按鈕等輸入類型。 1.概述 表單與其他頁面元素的作用不同。其他元素是把服務器發過來的內容顯示給用戶,而表單則是 把用戶的信息發送給服務器。 form 元素有兩個必要的屬性:action 和 method。action 屬性用于指定...

    andot 評論0 收藏0
  • HTML之body標簽中的相關標簽補充

    摘要:一列表標簽列表標簽分為三種。二表格標簽表格標簽用表示。單元格和單元格之間的距離外邊距,像素為單位。例如表示當前單元格在水平方向上要占據兩個單元格的位置。輸入標簽文本框輸入標簽文本框用于接收用戶輸入。一 列表標簽   列表標簽分為三種。   1、無序列表,無序列表中的每一項是     英文單詞解釋如下:       a.ul:unordered list,無序列表的意思。       b.l...

    felix0913 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<