用javascript替换多个单词？

Question

我正在使用以下代码在输入字段中用空白替换一个单词。

但是，我希望能够用空白替换多个单词。

基本上，我需要创建一个单词过滤器，以便用户无法键入某些单词。

HTML代码

<input type="text" id="demo" name="demo" onkeyup="myFunction()" onkeydown="myFunction()" />

JavaScript代码：

<script>
function myFunction() {
    var words = "badword1";
    var str = document.getElementById("demo").value; 
    var res = str.replace(words, " ");
    document.getElementById("demo").value = res;

}
</script>

我已经尝试过这样的事情：

<script>
function myFunction() {
    var words = "badword1 || badword2 || bad word3";
    var str = document.getElementById("demo").value; 
    var res = str.replace(words, " ");
    document.getElementById("demo").value = res;
    alert('that word is not allowed!');

}
</script>

但这不起作用。

首先，它不会用empty space替换任何给定的badword(s) ，其次，它会触发aler(); 我在输入字段中输入第一个字母后立即显示消息！

有人可以帮我这个忙吗？

Answer 1

使用正则表达式：

var words = new RegExp("badword1|badword|bad word3", g);

实际上，您不应该信任客户端代码...

Answer 2

像这样的东西需要输入错误的单词数组...遍历它们会创建一个全局正则表达式，然后用它替换它...如果更改了放置警报，则会比较原始字符串和结果字符串。

var badwords = ['badword1','badword2','badword3']; //array of badwords
function myFunction() {
    var str = document.getElementById("demo").value; 
    var res = str;
    for (var i = badwords.length - 1; i >= 0; i--) {
        var badword = badwords[i];
        badWordRegex = new RegExp(badword, 'g');
        res=res.replace(badWordRegex, " ");
    };

    document.getElementById("demo").value = res;

    if (str !== res){
        alert('that word is not allowed!');
    }
}