开发者

Find a character inside <label> and set class

I am trying to find a way to highlight some required fields in a form. I don't have access to the label settings for this application, so I'd like to try finding a character within the label and change it to be more prominent.

The current label for required fields is set as this example:

<label>First Name *</label>

I would like to find all instances of the asterisk * wit开发者_StackOverflow中文版hin label tags in a page and wrap them inside a CSS class so I can either set color or replace with an image. Is that achievable?

Thank you in advance.


find all labels contain an asterisk, replace the html with your element

 $("label:contains('*')").each(function(){
   var r = $(this).html().replace('*',','<sup class="conditions">*</sup>');
   $(this).html(r);
 });

but this could be done much nicer/faster with css:

 label.requiredField:after {
    content: "*";
    color:#f00;
 }

 /** your HTML would be **/
 <label class="requiredField">First Name</label>

 /** and renders like: **/
 First Name*

more here: http://www.quirksmode.org/css/beforeafter.html


The :contains selector will give you want you need:

$('label:contains("*")').wrap('<span style="color:red">');


$(label).filter(function () {
    return $(this).text().indexOf('*') != -1;
}).each(function () {
    $(this).whatEver();
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜