表單驗證 輸入內容後立即做出判斷

2022-09-13 18:21:08 字數 1709 閱讀 1569

整體思路:

1.確定好要輸入的內容的盒子(input,或模態框,h5)

2.設定錯誤資訊的內容和樣式(css),**注意剛開始的時候錯誤資訊的內容為隱藏狀態的

3.表單驗證,當輸入內容不符合正規表示式,錯誤資訊才被顯示出來

**如下:

1

doctype html

>

2<

html

lang

="en"

>

3<

head

>

4<

meta

charset

="utf-8"

>

5<

title

>表單驗證

title

>67

<

link

rel="stylesheet"

href

="">89

<

script

src=""

>

script

>

10head

>

1112

<

style

>

13/*

錯誤提示資訊隱藏

*/14

#root .err

19/*

綠色對號隱藏

*/20

#root i

23style

>

2425

26<

body

>

27<

div

id="root"

>

28 請輸入內容:<

input

type

="text"

>

2930

<

i style

="font-size: 26px;color: green;"

class

="iconfont icon-zhengque1"

>

i>

31<

br>

3233

<

span

class

="err"

style

="color: red"

>請輸入至少乙個字母

span

>

34div

>

35body

>

3637

38<

script

>

39$(

function()/

44//

獲取當前輸入框裡輸入的內容

45varc =

$(this

).val();

46//

判斷輸入框的內容是否符合正規表示式的標準,如果符合返回true,不符合返回false

47var

exp

=pattern.test(c);

48//

輸入內容符合正規表示式的要求

49if

(exp)

else

61});

62});

63script

>

6465

html

>

JavaScript判斷輸入內容是否為數字

方法一 不嚴謹 isnan is not a number 網上大部分人說這個方法有個問題,就是如果傳入引數是乙個空串或是乙個空格,而isnan是做為數字0進行處理的,所以isnan檢查不嚴密。自定義方法並呼叫,使用正規表示式 網上看到的都什麼玩意,測了很多有問題,所以自己 了乙個常用正規表示式 廢...

輸入內容後input控制項的位置改變

輸入內容後input控制項的位置改變,寫了挺久的前端 不知道為什麼之前沒有遇到這個問題。既然遇到了,那麼就在這裡總結一下經驗,遇到這個問題,是我在做乙個搜尋框的時候,下面是我解決的 input input hover input hover 為什麼會輸入內容後input控制項的位置改變?答 當我們使...

輸入內容來判斷是否為數字或字母

bin sh txt 輸入q或者q退出 請輸入內容來判斷是數字還是字母 while true doread p txt key test1 echo key sed s 0 9 g test2 echo key sed s a za z g test3 echo key sed s a za z0 ...