如果<a> element has text</a>添加一个类

时间:2015-03-09 12:30:21

标签: javascript jquery html css

我试图为包含带有文字的<a>的每个元素添加一个类,这样我就可以隐藏没有文字的<tr>!这是我的HTML代码和JavaScript:

&#13;
&#13;
$("tr a").each(function () {
    var a= $(e);
    if ($e.text().length > 0) {
        tr.addClass("buttoneffect");
    }
});
&#13;
table tr {
    height: 36px;
}

table tr:hover {
    background-color: #BEDB7F;
}
&#13;
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
    <tr>
        <td><a href="">Test 1</a></td>
    </tr>
    <tr>
        <td><a href="">Test 2</a></td>
    </tr>
    <tr>
        <td><a href=""></a></td>
	</tr>
    <tr>
        <td><a href="">Test 4</a></td>
    </tr>
    <tr>
        <td><a href=""></a></td>
    </tr>
    <tr>
        <td><a href="">Test 6</a></td>
    </tr>
</tbody>
</table>
&#13;
&#13;
&#13;

4 个答案:

答案 0 :(得分:2)

请参阅此fiddle

首先引用e,你没有在事件回调中传递,并且没有tr可以直接访问,你必须找出closest {{ 1}}到tr

的那个
a

<小时/> 此外,如果您希望隐藏trs,可以为其添加css:fiddle

$("tr a").each(function () {
    var a= $(this);
    if (a.text().length > 0) {
        a.closest('tr').addClass("buttoneffect");
    }
});

&#13;
&#13;
tr:not(.buttoneffect)
{
    display:none;
}
&#13;
$("tr a").each(function() {
  var a = $(this);
  if (a.text().length > 0) {
    a.closest('tr').addClass("buttoneffect");
  }
});
&#13;
table tr {
  height: 36px;
}
table tr:hover {
  background-color: #BEDB7F;
}
.buttoneffect {
  background: red;
}
tr:not(.buttoneffect) {
  display: none;
}
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以使用.filter()查找过滤这些元素,然后在过滤集上调用.addClass()来添加类

$("tr").filter(function () {
    return $(this).find('a').text().trim().length > 0
}).addClass("buttoneffect");

演示:Fiddle

答案 2 :(得分:0)

使用jquery parent()。

$("tr a").each(function () {
   var a= $(this);
   if (a.text().length > 0) {
         a.parnt('tr').addClass("buttoneffect");
  }
});

答案 3 :(得分:0)

试试这个Demo Here

$("tr a").each(function () {
    var a= $(this);
    if (a.text().length > 0) {
        a.closest('tr').addClass("buttoneffect");
    }
});