js获取td内input的value去控制tr是否显示
时间: 2023-10-09 17:10:12 浏览: 44
可以通过以下方式实现:
- 首先给要控制的 tr 设置一个 id,方便后面通过 DOM 操作获取元素。
- 然后在 input 的 onchange 事件中获取其 value 值,并根据需要控制 tr 的显示或隐藏。
示例代码如下:
HTML:
```html
<table>
<tr id="tr1">
<td><input type="text" onchange="checkInputValue(this.value)"></td>
</tr>
<tr id="tr2">
<td>...</td>
</tr>
<tr id="tr3">
<td>...</td>
</tr>
</table>
```
JavaScript:
```javascript
function checkInputValue(value) {
var tr = document.getElementById("tr1");
if (value === "xxx") {
tr.style.display = "none";
} else {
tr.style.display = "";
}
}
```
以上代码仅为示例,实际情况中需要根据具体需求进行适当修改。
相关问题
js动态获取td内input的value去控制tr是否显示
可以通过以下方式实现:
- 首先,使用 JavaScript 获取所有需要控制的 tr 元素,并且给每个 input 设置一个 onchange 事件。
- 在 onchange 事件中获取当前 input 所在的 td 和 tr 元素,以及当前 input 的 value 值。
- 根据需要控制的条件,控制 tr 的显示或隐藏。
示例代码如下:
HTML:
```html
<table>
<tr>
<td><input type="text" onchange="checkInputValue(this)"></td>
<td>...</td>
</tr>
<tr>
<td><input type="text" onchange="checkInputValue(this)"></td>
<td>...</td>
</tr>
<tr>
<td><input type="text" onchange="checkInputValue(this)"></td>
<td>...</td>
</tr>
</table>
```
JavaScript:
```javascript
function checkInputValue(input) {
var td = input.parentNode;
var tr = td.parentNode;
var value = input.value;
if (value === "xxx") {
tr.style.display = "none";
} else {
tr.style.display = "";
}
}
```
以上代码仅为示例,实际情况中需要根据具体需求进行适当修改。
js根据td内input的value去控制tr是否显示
可以通过以下方式实现:
- 首先,使用 JavaScript 获取所有需要控制的 tr 元素。
- 在遍历每个 tr 元素时,获取其内部的 input 元素,并获取 input 的 value 值。
- 根据需要控制的条件,控制 tr 的显示或隐藏。
示例代码如下:
HTML:
```html
<table>
<tr>
<td><input type="text"></td>
<td>...</td>
</tr>
<tr>
<td><input type="text"></td>
<td>...</td>
</tr>
<tr>
<td><input type="text"></td>
<td>...</td>
</tr>
</table>
```
JavaScript:
```javascript
var trs = document.getElementsByTagName("tr");
for (var i = 0; i < trs.length; i++) {
var input = trs[i].getElementsByTagName("input")[0];
var value = input.value;
if (value === "xxx") {
trs[i].style.display = "none";
} else {
trs[i].style.display = "";
}
}
```
以上代码仅为示例,实际情况中需要根据具体需求进行适当修改。