如何突出显示与正则表达式匹配的部分

我想突出（用红色）输入的错误部分（因此用户可以很容易地找出错误的位置和内容）并将错误部分与正则表达式匹配。如何突出显示与正则表达式匹配的部分

我试过类似如下：（说我接受字母而不是数字）

$("#myInputId") 
    .filter(function() { 
     return this.value.match(/[\d]/); 
    }) 
    .addClass("error")

但上面的代码是突出整个输入，但不是唯一的错误部分。

我只是把下面的图片，让我说的是更加清晰：

enter image description here

注意：我想做到这一点，不添加任何的jQuery插件突出显示文本。

2011-11-24 siva636

所以，你要突出显示的文字是：

<div id="myInputId">James<span class="error">1234</span></div>

您可以通过使用发现字符串，像这样实现这一目标在文本输入字段中（''）？ – Miikka

当然是的，在我的例子中，文本“James1234”，“James123Robert”在输入字段（抱歉，我的图像不够完美，无法显示） – siva636

我认为这是因为您正在向其中包含所有文本“James1234”的元素添加类“错误”。

此刻，我觉得这样的事情正在发生

<p class="error"> 
    james1234 
</p>

，如果它是免费的文字和你没有替换文本，改变了HTML来像这样

<p> 
    james<span class="error"/>1234<span/> 
</p>

所以要实现这个我认为你需要做这样的事情

var searchterm = '1234' 
    value.replace(searchTerm, "<span class='error'/>" + searchterm + "<span/>");

2011-11-24 08:56:47 RockThunder

如果我更改用户输入，当用户提交输入？ – siva636

如果您试图突出显示输入字段中的错误，那么您可以尝试这些事情1）在输入字段旁边添加显示错误文本的标签2）当用户点击提交时，在并在返回服务器的路上将其除去 – RockThunder

过滤功能ret因为this.value中的内容与所需的正则表达式匹配，因此它是真实的。因此整个元素#myInputId都可以。对于这个元素，你应用error类。

您只需将该类应用于相关部分。你应该做的，就是用#myInputId替换找到的字符串，并在同一个字符串中只包含一个错误范围。

此：

<div id="myInputId">James1234</div>

变为这样：

var newStr = wholeStr.replace(foundStr, '<span class="error">'+foundStr+'</span>');

2011-11-24 08:57:21 MeLight

如果我更改了用户输入，当用户提交输入时会发生不好的事情？ – siva636

我不确定我是否理解你的意思 – MeLight

如果用户输入改变了，必须在提交表单时执行反作用（双工） – siva636

回答