javascript - textarea根据输入不合法的内容变色

Question

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

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

Answer 1

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

Answer 2

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

Answer 3

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

Answer 4

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

Answer 5

这就相当于一个简版的文本编辑器了。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
});

Answer 6

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

Answer 7

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

Answer 8

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