Highlight exact string with jquery using contains selector

Question

I'm trying to highlight all fields that contain a certain string exactly, in the example below I will also match someuser2, someuser3 etc.

$("div.forumbody .username:contains('someuser')").css("background", "#6a5acd");

How can I search for the exact string and make the background of the field #6a5acd? Thanks in advance.

Govind Malviya · Accepted Answer · 2012-04-18 14:26:46Z

3

Try this

Create custom selector

$.expr[':'].textEquals = function(a, i, m) {
return $(a).text().match("^" + m[3] + "$");
};

and use it

$("div.forumbody .username:textEquals('someuser')").css("background", "#6a5acd");

edited Apr 18, 2012 at 14:26

answered Apr 18, 2012 at 14:08

Govind Malviya

13.8k17 gold badges70 silver badges95 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kyle Macey · Accepted Answer · 2012-04-18 14:33:32Z

1

That looks right to me... Make sure your selectors are working right without the contain...

$("div.forumbody .username").css("background", "#6a5acd");

EDIT

For text fields:

$("div.forumbody .username[value*=someuser]").css("background", "#6a5acd");

Or if they are not prepopulated (building off Govind's answer) :

$.expr[':'].valHas = function(a, i, m) {
  return $(a).val().match("^" + m[3] + "$");
};

$("div.forumbody .username:valHas('someuser')")

DOUBLE EDIT

This tested working and simpler:

jQuery("div.forumbody .username:text[value*='someuser']").css("background", "#6a5acd");

edited Apr 18, 2012 at 14:33

answered Apr 18, 2012 at 14:27

Kyle Macey

8,1543 gold badges40 silver badges78 bronze badges

Comments

Amadu Bah · Accepted Answer · 2013-08-27 10:13:50Z

0

Try add a extend pseudo function:

$.expr[':'].textEquals = $.expr.createPseudo(function(arg) {
    return function( elem ) {
        return $(elem).text().match("^" + arg + "$");
    };
});

Then you can do:

$("div.forumbody .username:textEquals('someuser')").css("background", "#6a5acd");

answered Aug 27, 2013 at 10:13

Amadu Bah

2,99530 silver badges27 bronze badges

Collectives™ on Stack Overflow

Highlight exact string with jquery using contains selector

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related