开发者

jQuery scan table th's for * and give parent a color

I have a rather (for me) complicated task with jQuery.

I want to scan an entire table for its th elements. If a th element has a ASTERISK (*) in it, I want to highlight the the parent, which is the tr element.

I know it sounds complicated when I explain it :)

So imagine I have a dynamic html table where I want to enable a feature to higlight certain rows. Therefore I just want to put some symbol (in my case an Asterisk *) to some text inside of a table cell. if jQuery detects a asterisk inside of 开发者_开发百科th it should automatically give its parent() a classname!

A start would be probably an each function:

$(function() {
    $("table tr th").each(function() {
        $(this).parent().addClass("special");            
    });
});

but I have no idea how to scan for the asterisk!


This could help:

$(function() {
    $("table tr th").each(function() {
        if ($(this).text().indexOf('*') > -1)            
            $(this).closest('tr').addClass("special");            
    });
});

EDIT: You'd probably want the th itself to have a special class as in the demo here


Here's a simpler way:

$("table tr th:contains('*')").parent().addClass("special");

Example at jsfiddle.

Edit from reading OP's comment:

In order to remove the asterisk, you'll need to iterate over the found elements:

$("table tr th:contains('*')").each(function(){
  var $This=$(this);

  $This.parent().addClass("special"); /* Add the "special" class */
  $This.text($This.text().replace("*","")); /* Remove the asterisk */
});

Example with asterisk removal.

0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜