javascript亵渎过滤器在一个contenteditable div上

时间:2013-04-18 03:19:37

标签: javascript jquery

我目前正在开发一个过滤阵列上不良字词的网站。每当用户在文本框中键入单词时,如果找到阵列中的单词,则会出现警告框。我想做同样的事情,但我不想使用文本框,而是想使用一个可信的div。我将需要jquery,但由于初始代码是在纯js中完成的,因此我的代码似乎存在一些冲突。

小提琴链接:http://jsfiddle.net/br7TD/

这是javascript:

var swear_words_arr=new Array("bad","evil","freak");
var swear_alert_arr=new Array;
var swear_alert_count=0;

function reset_alert_count() {
swear_alert_count=0;
}

function validate_user_text() {
reset_alert_count();
var compare_text=document.form1.user_text.value;

for(var i=0; i<swear_words_arr.length; i++) {
    for(var j=0; j<(compare_text.length); j++)
    {
        if(swear_words_arr[i]==compare_text.substring(j,(j+swear_words_arr[i].length)).toLowerCase())
            {
                swear_alert_arr[swear_alert_count]=compare_text.substring(j,(j+swear_words_arr[i].length));
                swear_alert_count++;
            }
    }
}

var alert_text="";  
for(var k=1; k<=swear_alert_count; k++)
{
    alert_text+="\n" + "(" + k + ")  " + swear_alert_arr[k-1];
}

if(swear_alert_count>0) {
    alert("Please refrain from using offensive words"); /* + alert_text */
    document.form1.user_text.select();
    }
else {
    document.form1.submit();
}
}

function select_area() {
document.form1.user_text.select();
}

window.onload=reset_alert_count;

我对此非常陌生。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:1)

尝试

<div id="textArea">
    <span id="myInput" contenteditable="true">kfjdkfj</span>
</div>

var swear_words_arr=new Array("bad","evil","freak");
var regex = new RegExp('\\b(' + swear_words_arr.join('|') + ')\\b', 'i' );

function validate_user_text() {
    var text = $('#myInput').text();

    if(regex.test(text)) {
        alert("Please refrain from using offensive words"); /* + alert_text */
        $('#myInput').focus();
        return false;
    }

}

演示:Fiddle

更像jQuery的解决方案可以是found here