0

请注意，故意包含“C#”标签，因为我可以在此处接受 C# 语法作为我的答案，因为我可以选择在客户端和服务器端执行此操作。阅读下面的“您可能想知道的事情”部分。此外，还包括了“正则表达式”标签，因为使用正则表达式很可能是解决此问题的最佳方法。

我在这里找到了以下突出显示插件：

http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html

这是该插件中的代码：

/*

highlight v4

Highlights arbitrary terms.

<http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html>

MIT license.

Johann Burkard
<http://johannburkard.de>
<mailto:jb@eaio.com>

*/

jQuery.fn.highlight = function(pat) {
 function innerHighlight(node, pat) {
  var skip = 0;
  if (node.nodeType == 3) {
   var pos = node.data.toUpperCase().indexOf(pat);
   if (pos >= 0) {
    var spannode = document.createElement('span');
    spannode.className = 'highlight';
    var middlebit = node.splitText(pos);
    var endbit = middlebit.splitText(pat.length);
    var middleclone = middlebit.cloneNode(true);
    spannode.appendChild(middleclone);
    middlebit.parentNode.replaceChild(spannode, middlebit);
    skip = 1;
   }
  }
  else if (node.nodeType == 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) {
   for (var i = 0; i < node.childNodes.length; ++i) {
    i += innerHighlight(node.childNodes[i], pat);
   }
  }
  return skip;
 }
 return this.length && pat && pat.length ? this.each(function() {
  innerHighlight(this, pat.toUpperCase());
 }) : this;
};

jQuery.fn.removeHighlight = function() {
 return this.find("span.highlight").each(function() {
  this.parentNode.firstChild.nodeName;
  with (this.parentNode) {
   replaceChild(this.firstChild, this);
   normalize();
  }
 }).end();
};

这个插件很容易工作。

如果我想突出显示以下元素中“农场”一词的所有实例......（续）

<div id="#myDiv">Farmers farm at Farmer's Market</div>

...（续）我需要做的就是使用：

$("#myDiv").highlight("farm");

然后它会突出显示“Farmers”和“Farmer's”中的前四个字符，以及“farm”中的整个单词div#myDiv

没问题，但我希望它使用这个：

$("#myDiv").highlight("Farmers");

并让它突出显示“农民”和“农民”。当然，问题是我不知道运行时搜索词（本例中的“农民”一词）的值。所以我需要在字符串的每个索引处检测不超过一个撇号的所有可能性。例如，如果我$("#myDiv").highlight("Farmers");在上面的代码示例中调用，我还需要突出显示原始字符串的每个实例，另外：

  • '农民
  • 农夫
  • 农夫
  • 农民
  • 农民
  • 农民
  • 农夫的
  • 农民

当然，不应突出显示两个或多个撇号并排出现的实例，例如“Fa''rmers”。

我想如果我能包括（突出显示）像“Fa'rmer's”这样的词会很好，但我不会碰运气，我会做得很好，只是为了得到像我上面的项目符号列表中找到的那些匹配，其中只有一个撇号出现在字符串中。

我考虑过正则表达式，但我不太了解语法，更不用说我认为我不能用真/假返回值做任何事情。

反正有什么可以完成我在这里需要的吗？

您可能想知道的事情：

  1. 高亮插件处理了我需要的所有不区分大小写的要求，所以完全不用担心。
  2. JavaScript、jQuery 甚至 C# 中提供的语法是可以接受的，考虑到我使用来自客户端的值的隐藏输入字段，在服务器端使用我的 C# 代码填充。

  3. 填充隐藏输入字段的 C# 代码使用 Razor（即，我在 C#.Net Web-Pages w/WebMatrix 环境中。但是，此代码非常简单，如下所示：

    for (var n = 0; n < searchTermsArray.Length; n++)

    {

    <input class="highlightTerm" type="hidden" value="@searchTermsArray[n]" />

    }

4

1 回答 1

2

我正在从您之前的问题中复制这个答案。

我认为在阅读了其他答案的评论后，我已经弄清楚了您的目的。您不需要一个可以为任何可能的输入执行此操作的正则表达式，您已经有输入，并且您需要构建一个匹配它及其变体的正则表达式。你需要做的是这个。需要明确的是，由于您在问题中误解了，因此以下语法实际上是在 JavaScript 中。

var re = new RegExp("'?" + "farmers".split("").join("'?") + "'?", "i")

这样做是获取您的输入字符串，"farmers"并将其拆分为单个字符的列表。

"farmers".split("") == [ 'f', 'a', 'r', 'm', 'e', 'r', 's' ]

然后，它在字符之间再次将字符缝合在一起"'?"。在正则表达式中，这意味着该'字符是可选的。我将相同的粒子添加到表达式的开头和结尾以匹配字符串的开头和结尾。

这将创建一个与您描述的方式匹配的正则表达式，前提是它也与原始字符串匹配。

在这种情况下，上面的行构建了这个正则表达式：

/'?f'?a'?r'?m'?e'?r'?s'?/

编辑

在看了这个和你正在使用的函数之后，我认为你最好的选择是修改 highlight 函数以使用正则表达式而不是直接替换字符串。我认为它甚至不会那么难处理。这是一个完全未经测试的尝试。

function innerHighlight(node, pat) {
    var skip = 0;
    if (node.nodeType == 3) {
        var matchResult = pat.exec(node.data);  // exec the regex instead of toUpperCase-ing the string
        var pos = matchResult !== null ? matchResult.index : -1;  // index is the location of where the matching text is found
        if (pos >= 0) {
            var spannode = document.createElement('span');
            spannode.className = 'highlight';
            var middlebit = node.splitText(pos);
            var endbit = middlebit.splitText(matchResult[0].length);  // matchResult[0] is the last matching characters.
            var middleclone = middlebit.cloneNode(true);
            spannode.appendChild(middleclone);
            middlebit.parentNode.replaceChild(spannode, middlebit);
            skip = 1;
        }
    }
    else if (node.nodeType == 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) {
        for (var i = 0; i < node.childNodes.length; ++i) {
            i += innerHighlight(node.childNodes[i], pat);
        }
    }
    return skip;
 }

我在这里尝试做的是保留现有逻辑，但使用我构建的正则表达式来查找和拆分字符串。请注意，我不再进行 toUpper 调用，而是使正则表达式不区分大小写。如前所述，我根本没有对此进行测试，但它似乎应该非常接近一个可行的解决方案。无论如何，足以让你开始。

请注意，这不会让您获得隐藏字段。我不确定你需要这些做什么，但这会（如果它是正确的）负责突出显示字符串。

于 2013-11-01T20:46:53.857 回答