c#mvc+js table中根据其他td的值来控制td中的a标签隐藏
时间: 2024-05-07 14:23:18 浏览: 107
C#选项卡TtabControl实现标签隐藏源代码
4星 · 用户满意度95%
可以使用JavaScript来实现这个功能。首先,给需要控制的td元素添加一个class,如:`controlled-td`。然后,在JavaScript中获取所有具有该class的元素,并遍历它们。在遍历每个元素时,获取其相邻的td元素的值,判断是否需要隐藏a标签。
以下是示例代码:
```html
<table>
<tbody>
<tr>
<td>100</td>
<td class="controlled-td">
<a href="#">Link</a>
</td>
</tr>
<tr>
<td>200</td>
<td class="controlled-td">
<a href="#">Link</a>
</td>
</tr>
</tbody>
</table>
```
```javascript
// 获取所有具有controlled-td类名的元素
var controlledTds = document.querySelectorAll('.controlled-td');
// 遍历每个元素
for (var i = 0; i < controlledTds.length; i++) {
var td = controlledTds[i];
var value = td.previousElementSibling.textContent;
// 判断是否需要隐藏a标签
if (value < 150) {
td.querySelector('a').style.display = 'none';
}
}
```
在上面的代码中,我们使用`querySelectorAll`方法获取所有带有`.controlled-td`类名的元素,并使用`previousElementSibling`方法获取相邻的td元素的值。最后,根据条件判断是否需要隐藏a标签,如果需要则设置其CSS样式`display:none`。
阅读全文