欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js正則校驗特殊的不可見字符的具體實現(xiàn)

 更新時間:2024年06月25日 11:10:19   作者:Charonmomo  
用戶可能從Excel或者其他地方直接復(fù)制粘貼,這時候提交到后端會導(dǎo)致獲取的用戶輸入中包含一些特殊的不可見字符,本文主要介紹了js正則校驗特殊的不可見字符的具體實現(xiàn),具有一定的參考價值,感興趣的可以了解一下

背景

表單的輸入框,用戶可能從Excel或者其他地方直接復(fù)制粘貼,這時候提交到后端會導(dǎo)致獲取的用戶輸入中包含一些特殊的不可見字符,比如tab鍵或者制表符等,這時需要在前端對用戶輸入做一些檢驗,檢查是否存在不可見字符。

方法

ASCII 編碼中第 0~31 個字符(開頭的 32 個字符)以及第 127
個字符(最后一個字符)都是不可見的(無法顯示),但是它們都具有一些特殊功能,所以稱為控制字符( Control
Character)或者功能碼(Function Code)。

ASCII 碼關(guān)鍵部分的信息如下圖:

在這里插入圖片描述

在這里插入圖片描述

在這里插入圖片描述

注意這里 0~31 及127字符 是控制字符(不可見字符),我們可以在正則中通過校驗是否包含這些字符的16進制來判斷是否含有特殊字符。

關(guān)于這些控制字符的詳細(xì)含義可以參考:ASCII控制字符的解釋

完整的 ASCII 碼表:

在這里插入圖片描述

校驗

在線正則校驗工具:正則表達式在線測試

一串簡單的測試文本:

ABC1823中文0456def$%#?.            mMo

1. 校驗是否含有特殊的不可見字符
只要有一個不可見字符就會報錯

[\x00-\x1F\x7F]

注意這里是兩個0,采用 \x0-\x1F\x7F 這種格式是錯誤的,沒法進行正常的校驗。

在這里插入圖片描述

2. 檢驗是否含有不可見字符

[^\x00-\x1F\x7F]+

注意這里 ^ 的位置不要寫在外面,外面表示以什么開頭

在這里插入圖片描述

代碼

import React,{useState} from "react";
import {Input,message} from "antd";

const RegTestInput = function(){
	
	const testValue = (e) => {
		const { value } = e.target;
		if(value) {
			const reg = /[\x00-\x1f\x7f]/
			if(reg.test(value)){
				message.error("不允許包含特殊字符")
			}
		}
	}
	
	return (
		<div>
			<Input onChange={testValue} />
		</div>
	)
}

到此這篇關(guān)于js正則校驗特殊的不可見字符的文章就介紹到這了,更多相關(guān)js正則校驗不可見字符內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家! 

相關(guān)文章

  • 怎么在下面的HTML里調(diào)用數(shù)組cs[]的值

    怎么在下面的HTML里調(diào)用數(shù)組cs[]的值

    怎么在下面的HTML里調(diào)用數(shù)組cs[]的值...
    2007-01-01
  • 微信小程序音樂播放器開發(fā)

    微信小程序音樂播放器開發(fā)

    這篇文章主要為大家詳細(xì)介紹了微信小程序音樂播放器開發(fā),文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2019-11-11
  • JavaScript基于對象去除數(shù)組重復(fù)項的方法

    JavaScript基于對象去除數(shù)組重復(fù)項的方法

    這篇文章主要介紹了JavaScript基于對象去除數(shù)組重復(fù)項的方法,結(jié)合實例形式分析了javascript數(shù)組去重的操作步驟與具體實現(xiàn)技巧,需要的朋友可以參考下
    2016-10-10
  • JavaScript?管道運算符及工作原理

    JavaScript?管道運算符及工作原理

    這篇文章主要介紹了JavaScript?管道運算符,管道運算符為我們的代碼添加了大量上下文,并簡化了操作,以便以后可以擴展它們,本文結(jié)合示例代碼給大家介紹的非常詳細(xì),需要的朋友可以參考下
    2023-05-05
  • JavaScript動態(tài)檢測密碼強度原理及實現(xiàn)方法詳解

    JavaScript動態(tài)檢測密碼強度原理及實現(xiàn)方法詳解

    這篇文章主要介紹了JavaScript動態(tài)檢測密碼強度原理及實現(xiàn)方法,結(jié)合具體實例形式詳細(xì)分析了javascript針對輸入字符串密碼強度檢測的原理與相關(guān)判斷操作技巧,需要的朋友可以參考下
    2019-06-06
  • 詳解nuxt 微信公眾號支付遇到的問題與解決

    詳解nuxt 微信公眾號支付遇到的問題與解決

    這篇文章主要介紹了詳解nuxt 微信公眾號支付遇到的問題與解決,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-08-08
  • js隨機生成字母數(shù)字組合的字符串 隨機動畫數(shù)字

    js隨機生成字母數(shù)字組合的字符串 隨機動畫數(shù)字

    本篇文章給大家分享的js隨機生成字母數(shù)字組合的字符串,js隨機生成動畫數(shù)字,包括常用的產(chǎn)生隨機數(shù)的用法,需要的朋友可以參考下
    2015-09-09
  • 原生js實現(xiàn)拼圖效果

    原生js實現(xiàn)拼圖效果

    這篇文章主要為大家詳細(xì)介紹了原生js實現(xiàn)拼圖效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-08-08
  • js實現(xiàn)登錄驗證碼

    js實現(xiàn)登錄驗證碼

    本文主要介紹了js實現(xiàn)登錄驗證碼的方法,代碼簡潔明了,具有很好的參考價值,需要的朋友一起來看下吧
    2016-12-12
  • jsonp跨域獲取百度聯(lián)想詞的方法分析

    jsonp跨域獲取百度聯(lián)想詞的方法分析

    這篇文章主要介紹了jsonp跨域獲取百度聯(lián)想詞的方法,結(jié)合實例形式分析了jsonp的原理及跨域獲取百度聯(lián)想詞的相關(guān)操作技巧,需要的朋友可以參考下
    2019-05-05

最新評論