日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

js正则检测输入内容为数字,包括负数,整数,浮点数,亲测可用.JS检测整数,js检测浮点数,js检测负数,js检测数字,js限制输入框只输入数字,解决H5 number类型只能输入正数问题.

發布時間:2024/7/19 javascript 28 豆豆

JS 正則實現數字檢測和限制輸入,包括整數、浮點數、負數(親測可用)


網上搜了一下,居然可以直接拿來用的很少,要么就是只能檢測正整數、要么是只能檢測浮點數,總之很多都不適合,而H5提供的type="number"又只允許輸入正數(負號會被認定為非法字符),有所限制。有的時候屬性 maxlength 也會失效。

用正則寫一個數字檢測函數也不難,經測試(親測有效😄),完全可用!


實現功能:數字檢測和限制輸入

數字包括:

  • 正/負整數,例如 1,-1
  • 正/負浮點數,例如 -0.1,0.1
  • 限制輸入:

    當輸入-, ., 0~9 以外的字符時,input 輸入框自動刪除該字符,也就是不允許輸入該字符。

    錯誤檢測:

    當出現重復的 -, .,報錯,不允許提交。

    長度限制:

    防止 maxlength 失效,限制數字(包括字符)的長度,比如這里我限制長度為9.

    代碼

    直接放代碼,比較簡單。

    <input type="text" oninput="n=9; if(value.length>n) value=value.slice(0,n); value=value.replace(/[^\d-.]/g,''); number_check(this);"> function number_check(input_box) {reg = /^(-?\d+)\.?(\d*)$/;if (input_box.value.match(reg) == null) {//... 如果匹配失敗的話(輸入非法)}else {//... 如果匹配成功的話(輸入合法)} }

    解釋

    首先,制定了 oninput,表明輸入時觸發事件,做到實時檢測。

    長度限制

    n=9; // 設置長度 if(value.length>n) // 取值,若超過n,則slice切片value=value.slice(0,n);

    限制數字類字符輸入

    value=value.replace(/[^\d-.]/g,'');

    用''空字符替換除\d,-,.之外的一切字符,也就是說,當輸入上述三個字符之外的任意字符,都將立即被刪除。

    數字檢測

    但是,value.replace(/[^\d-.]/g,'');有個弊端,就是可以重復輸入-,.這兩個被允許輸入的字符,比如 --1, 2.3.4 這樣的不合法數,因此就需要再對輸入的數進行校驗。

    function number_check(input_box) {reg = /^(-?\d+)\.?(\d*)$/;

    這里 /^(-?\d+)\.?(\d*)$/ 的想法是,一個合法數,不管是整數還是浮點數,都必須要以至少一個數字開頭,所以 ^\d+. 若是負數,則還必須在開頭存在一個負號,那么 ^(-?\d+)。若是浮點數,則還須在數字中間的部分存在一小數點,而小數點后的數字可有可無(當小數點后的數字不存在時,認為是整數),那么 .?(\d*) .


    轉載需注明出處:?? Sylvan Ding’s blog

    總結

    以上是生活随笔為你收集整理的js正则检测输入内容为数字,包括负数,整数,浮点数,亲测可用.JS检测整数,js检测浮点数,js检测负数,js检测数字,js限制输入框只输入数字,解决H5 number类型只能输入正数问题.的全部內容,希望文章能夠幫你解決所遇到的問題。

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