js用面向对象-过滤敏感词汇

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			window.onload = function() {
				//普通方式
				// var pt = document.querySelector('input');
				// var p = document.querySelector('p');
				// pt.onkeyup = function(e) {
				// 	var ev = window.event || e;
				// 	if (ev.keyCode == 13) {
				// 		var sens = /测试内容|和谐|疫情/g;
				// 		var txt = pt.value;
				// 		if (sens.test(txt)) {
				// 			p.innerText = txt.replace(sens, '***');
				// 			sens.lastIndex = 0; //调整记号 下次匹配还从头开始
				// 		} else {
				// 			p.innerText = txt;
				// 		}
				// 	}
				// }
				//'敏感词' 如果加全局匹配 就会出现下一次匹配接着上一次匹配的末尾进行的bug
				//解决bug的办法1:不加g
				//解决bug的方法2:我们就可以把记号重新调整到下标0 
				//调整方法: 正则表达式.lastIndex = 0;

				//面向对象
				function Sensitive(){
					this.pt = document.querySelector('input');
					this.p = document.querySelector('p');
					this.init();
					// console.log(this.pt,this.p)
				}
				Sensitive.prototype.init = function(){
					var that = this;
					//按下键盘
					this.pt.onkeyup = function(e){
						var ev = window.event || e;
						that.up(ev);
					}
				}
				Sensitive.prototype.up = function(ev){
					// console.log(ev) 
					// keyCode: 13 enter
					if(ev.keyCode == 13){
						var txt = this.pt.value;
						//设置正则
						var sens = /测试内容|和谐|疫情/g;
						//替换敏感内容
						this.p.innerHTML = txt.replace(sens,function(a){
							return a.replace(/./g,'*');
						})
					}
				}

				new Sensitive();
			}
		</script>
	</head>
	<body>
		<input type="text" value="测试内容" placeholder="请输入敏感词汇" />
		<p></p>
	</body>
</html>

posted @   JackieDYH  阅读(9)  评论(0编辑  收藏  举报  
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示