javascript - textarea根据输入不合法的内容变色
女神的闺蜜爱上我
女神的闺蜜爱上我 2017-06-14 10:51:41
0
8
935

在textarea中输入内容,当里面有不合法的词语时把不合法的词语变成红色(警示显示)。

无法显示该内容,有什么好方法解决

女神的闺蜜爱上我
女神的闺蜜爱上我

全部回复(8)
代言

这里的现成工具jQuery Validation Plugin,是把整个输入框变红色虚线,正常则是黑色实线。这样子或许也比较顾虑到色盲人士的使用权益

Peter_Zhu

textarea是纯文本编辑控件,没法将里面的文字渲染成多种不同颜色,里面没法包含其他标签

漂亮男人

这个还是用另一个标签同步输出内容和里面的正确或错误情况吧 这个是richtext了

黄舟

font标签去除,如不合法也texarea设置color:#red

女神的闺蜜爱上我

这就相当于一个简版的文本编辑器了。textarea同步获取输入的内容。

var textRefer = document.getElementById('text-refer'),
  textInput = document.getElementById('text-input');

textInput.addEventListener('keyup', function() {
  var val = textInput.value;
  val = val.replace(/[\n\t\s]+/g, ''); // 去除换行、Tab、空格
  val = val.replace(/([^\w+])/g, '<span class="red"></span>'); // 匹配符号
  textRefer.innerHTML = val; // 设置 HTML
});

阿神

textarea是纯文本编辑控件,是不能再在里面嵌套标签,根据你的需求,提供以下思路,你可以在textarea中进行输入,在后面再加一个p,层级在textarea下,p同步获取文本框的内容,用js正则做验证,如果字符串中有敏感词,则给该子字符串加颜色。

为情所困

用正则验证吧,textarea标签里面不能直接写font标签吧

阿神

正则判断,然后replace()掉存在错误的字符即可。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!