input输入框怎样使用正则表达式

发布网友发布时间：2022-05-15 06:20

共2个回答

懂视网时间：2022-05-15 10:41

这次给大家带来正则如何对输入内容进行处理，正则对输入内容进行处理的注意事项有哪些，下面就是实战案例，一起来看一下。

该小脚本实现的是对输入框内容中取出<img>标签中的src中的内容，然后在原来位置进行替换内容，然后在去除输入内容中的html标签，空格等操作

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title></title>
 <script>
 window.onload = function () {
 var target = document.getElementById("p1");
 var but = document.getElementById("but");
 var value;
 but.onclick = function () {
 value = target.innerHTML;
 result = dealText(value);
 alert(result);
 };
 };
 function dealText(msg) {
 var text1 = imageRound(msg);
 var text2 = removeTag(text1);
 var text3 = removeBlank(text2);
 var text4 = changeNBSP(text3);
 return text4;
 }
 function DealNum(num) {
 var content = [];
 for (var i = 0; i < num.length; i++) {
 //
 content.push(defaultSrc(num[i]));
 }
 return content;
 }
 function defaultSrc(src) {
 return ':avator:';
 }
 function returnValue(srcValue) {
 var num = [];
 var pattern = /([^/]+)./;
 var src;
 for (var i = 0; i < srcValue.length; i++) {
 src = pattern.exec(srcValue[i])[1];
 num.push(src);
 }
// alert(num);
 var source = DealNum(num);
 return source;
 }
 function imageRound(text) {
 var reg2 = /<img.*?>/gi;
 var s = text.match(reg2);
 var num = returnValue(s);
 var i = 0;
 var content = text.replace(reg2, function () {
 return num[i++];
 });
 return content;
 }
 function removeTag(text) {
 var text1;
 var reg = /<.*?>|<.*?/>/g;
 text1 = text.replace(reg, "");
 return text1;
 }
 function removeBlank(text) {
 var text1;
 var reg = /s+/g;
 text1 = text.replace(reg, "");
 return text1;
 }
 function changeNBSP(text) {
 var text1;
 var reg = / /g;
 var reg1 = /;/g;
 text1 = text.replace(reg, ' ');
 text1 = text1.replace(reg1, "");
 return text1;
 }
 </script>
</head>
<body>
<p contenteditable="true" id="p1">abc efg <img src="asdjk/123.jpg"/><span>hi gk</span><img
 src="ahdkh/124.jpg"/>
 <p>lmnop</p>
 q rst uvw
</p>
<button id="but">更新</button>
</body>
</html>

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！