jquery 在嵌套中添加类 <td>
jquery addclass in nested <td>
我正在尝试使用 jquery 在 SharePoint 列表中进行条件格式化。我遇到的问题是,在 SharePoint 页面中放置代码时,SharePoint 会添加一堆垃圾。我正在尝试有条件地突出显示 table 中带有特定文本的特定单元格。红色 = 红色背景,绿色 = 绿色背景。
我的编码方式存在问题,因为我的 table 被包裹在另一个 table 中(我无法控制这个),我正在寻找td 中的文本,父 td 也会设置样式。我只想用其中的文本设置特定 td 的样式。
我有一个 codepen 显示我所做的事情:http://codepen.io/Gregc72/pen/NdmoXj
HTML
<table>
<tr>
<td>
<table>
<tr><td>Test 1</td><td>Red</td></tr>
<tr><td>Test 2</td><td>Green</td></tr>
</table>
</tr></td><table>
CSS
.greenBg {
background: green;
}
.redBg {
background: red;
}
脚本
$("td:contains('Green')").addClass('greenBg');
$("td:contains('Red')").addClass('redBg');
我不知道我是否可以以不同的方式格式化我的 css 选择器来完成此操作,或者我是否必须使用某种循环函数。我敢肯定答案很简单,我只是忽略了它。
如果这是你的修复结构,那么试试这个:
$("table tr td table tr td:contains('Green')").addClass('greenBg');
$("table tr td table tr td:contains('Red')").addClass('redBg');
这可能是使用 filter()
函数的好主意
$("td").filter(
function (index) { return $(this).text() == "Red"; }
).addClass("redBg");
$("td").filter(
function (index) { return $(this).text() == "Green"; }
).addClass("greenBg");
我正在尝试使用 jquery 在 SharePoint 列表中进行条件格式化。我遇到的问题是,在 SharePoint 页面中放置代码时,SharePoint 会添加一堆垃圾。我正在尝试有条件地突出显示 table 中带有特定文本的特定单元格。红色 = 红色背景,绿色 = 绿色背景。
我的编码方式存在问题,因为我的 table 被包裹在另一个 table 中(我无法控制这个),我正在寻找td 中的文本,父 td 也会设置样式。我只想用其中的文本设置特定 td 的样式。
我有一个 codepen 显示我所做的事情:http://codepen.io/Gregc72/pen/NdmoXj
HTML
<table>
<tr>
<td>
<table>
<tr><td>Test 1</td><td>Red</td></tr>
<tr><td>Test 2</td><td>Green</td></tr>
</table>
</tr></td><table>
CSS
.greenBg {
background: green;
}
.redBg {
background: red;
}
脚本
$("td:contains('Green')").addClass('greenBg');
$("td:contains('Red')").addClass('redBg');
我不知道我是否可以以不同的方式格式化我的 css 选择器来完成此操作,或者我是否必须使用某种循环函数。我敢肯定答案很简单,我只是忽略了它。
如果这是你的修复结构,那么试试这个:
$("table tr td table tr td:contains('Green')").addClass('greenBg');
$("table tr td table tr td:contains('Red')").addClass('redBg');
这可能是使用 filter()
函数的好主意
$("td").filter(
function (index) { return $(this).text() == "Red"; }
).addClass("redBg");
$("td").filter(
function (index) { return $(this).text() == "Green"; }
).addClass("greenBg");