我有一个包含多行的表。在一列中,有一个链接(列a)。在第二列中,有字符串"是"或"否" (b栏)。
如果b列中的单元格显示" No",我希望单元格中的链接直接位于a列的左侧,以便禁用。
我使用.each()
浏览b列中的每个td,看看该值是否为"是"或"否"。好像即使b列中的单元格是"是",它仍然会禁用(重命名)匹配单元格上的链接。我错过了什么?
$(document).ready(function () {
$("td.regFull").each(function () {
console.log($(this).text());
if($(this).text() !== 'No') {
$('td.regLink a').replaceWith('Closed');
}
});
});

td {
border: 1px solid black;
padding: 5px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<th>Link</th>
<th>Registration Open</th>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
No
</td>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
Yes
</td>
</tr>
</table>
&#13;
答案 0 :(得分:1)
而不是这一行
$(&#39; td.regLink a&#39;)。replaceWith(&#39; Closed&#39;);
将其设为最接近的元素
$(this).closest(&#39; td.regLink a&#39;)。replaceWith(&#39; Closed&#39;);
答案 1 :(得分:1)
我的建议是:
要禁用链接,您可以删除href属性。
要选择所有链接,您可以将所有链接减少到一行:
$("td.regFull:contains('No')").siblings('td.regLink').children('a').removeAttr('href')
摘录:
$(function () {
$("td.regFull:contains('No')").siblings('td.regLink').children('a').removeAttr('href').text('Closed');
});
td {
border: 1px solid black;
padding: 5px;
}
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<table>
<tr>
<th>Link</th>
<th>Registration Open</th>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
No
</td>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
Yes
</td>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
No
</td>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
Yes
</td>
</tr>
</table>
答案 2 :(得分:1)
您必须在条件中修剪.regFull
的内容以删除空格。
转到父tr,然后选择.regLink
:
$(this).parents('tr').find('.regLink a').replaceWith('Closed');
如果b列中的单元格显示“No”,我希望单元格中的链接直接位于a列的左侧,以便禁用。
因此,您必须在!==
到===
的情况下撤销您的运营商。
希望这有帮助。
$(document).ready(function () {
$("td.regFull").each(function () {
console.log($(this).text().trim());
if($(this).text().trim() === 'No') {
$(this).parents('tr').find('.regLink a').replaceWith('Closed');
}
});
});
td {
border: 1px solid black;
padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<th>Link</th>
<th>Registration Open</th>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
No
</td>
</tr>
<tr>
<td class="regLink">
<a href="#">Register</a>
</td>
<td class="regFull">
Yes
</td>
</tr>
</table>