javascript - 替换 RegExp - 否定模式

Question

我有'contenteditable'的div。我想在这个 div 中过滤字符，什么时候是[^ą-źa-z0-9\s]AND NOT ( )，我必须更改颜色字符，不匹配模式。例如，当我得到$(this).html()： dfgtąść45 %$# tg ss & k ; - 我想更改为红色粗体字符。

JS：

var t = $(this).html().replace(/<\/?[^>]+>/gi, '').replace(/\s$/, '&nbsp;');
t = t.replace(/(&nbsp;)[^ą-źa-z0-9\s]/ig,function(match){return '<span style="color: red;">' + match + "</span>";});
$(this).html(t);

Answer 1

这是一种方法

t = t.replace( /( )|(?:(?! )[^ą-źa-z0-9\s])+/ig,
    function ( match, nbsp ) {
        return nbsp ? nbsp : '<span style="color: red;">' + match + "</span>";
});

请注意，虽然不建议以这种方式操作 html：例如，元素属性中与否定字符类匹配的任何字符都将错误地包含在span标签中。

Answer 2

如果要突出显示与特定模式不匹配的任何内容，可以使用此代码。这比尝试修改正则表达式来否定匹配项更具可扩展性。

function unmatches(regex, str, callback) {

    var result = "";
    var lastAppend = 0;

    var arr;
    var nonMatching;

    while ((arr = regex.exec(str)) != null) {
        nonMatching = str.substring(lastAppend, arr.index);

        if (typeof callback === "function") {
            nonMatching = callback(nonMatching);
        }
        // If a function is not supplied, currently, it output back
        // the input string. It can be extended, though.

        result += nonMatching + arr[0];
        lastAppend = arr.index + arr[0].length;

        // In case the global flag is not set
        // There is at most one match without global flag
        if (!regex.global) {
            break;
        }
    }

    nonMatching = str.substring(lastAppend);

    if (typeof callback === "function") {
        nonMatching = callback(nonMatching);
    }

    result += nonMatching;

    return result;
}

以您的案例为例（请注意，我添加了g标志）：

var result = unmatches(/( )*[ą-źa-z0-9\s]+/g, "dfgtąść45%$#tg ss&k;", function (m) {
    if (m === "") {
        // Non matching part can be empty string
        return m; // Ignore
    } else {
        // The non-empty string case
        return '<span style="color: red;">' + m + '</span>';
    }
});