Javascript – Textbereich ändert die Farbe basierend auf illegalen Eingabeinhalten
女神的闺蜜爱上我
女神的闺蜜爱上我 2017-06-14 10:51:41
0
8
959

Geben Sie Inhalte in das Textfeld ein. Wenn darin illegale Wörter enthalten sind, werden die illegalen Wörter rot angezeigt (Warnungsanzeige).

Der Inhalt kann nicht angezeigt werden. Gibt es eine gute Möglichkeit, das Problem zu lösen?

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

Antworte allen(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">$1</span>'); // 匹配符号
  textRefer.innerHTML = val; // 设置 HTML
});

阿神

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

为情所困

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

阿神

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

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!