在你提供的代码中我需要在添加时自动识别对应列的属性名<td class="auto-wrap"><input type="text" name="aoi_step" value="ACT"></td> <td class="auto-wrap"><input type="text" name="defect_type" value="ACT"></td> <td class="auto-wrap"><input type="text" name="layer_code" value="ACT"></td> <td class="auto-wrap"><input type="text" name="type" value="ACT"></td> <td class="auto-wrap"><input type="text" name="dpet" value="ACT"></td> <td class="auto-wrap"><input type="text" name="subcode" value="ACT"></td> <td class="auto-wrap"><textarea name="code_description">ACT</textarea></td> <td><input type="file" name="image1_path" onchange="previewImage(this);selectCell(this)" onclick="showPopup(this.src)" style="width: 100px; height: auto;"></td> <td> <input type="file" name="image2_path" onchange="previewImage(this);selectCell(this)" onclick="showPopup(this.src)" style="width: 100px; height: auto;"> </td> <td> <input type="file" name="image3_path" onchange="previewImage(this);selectCell(this)" onclick="showPopup(this.src)" style="width: 100px; height: auto;"> </td> <td> <input type="file" name="image4_path" onchange="previewImage(this);selectCell(this)" onclick="showPopup(this.src)" style="width: 100px; height: auto;"> </td> <td> <input type="file" name="image5_path" onchange="previewImage(this);selectCell(this)" onclick="showPopup(this.src)" style="width: 100px; height: auto;"> </td> <td class="auto-wrap"><textarea name="determination_rule">ACT</textarea></td>
时间: 2023-08-06 19:04:48 浏览: 95
要实现自动识别对应列的属性名并设置到新插入的输入元素中,您可以根据表格结构和属性名的命名规则进行处理。以下是修改后的代码示例:
```javascript
function insertInputElements() {
var table = document.getElementById("myTable");
var rows = table.getElementsByTagName("tr");
for (var i = 1; i < rows.length; i++) { // 从第二行开始,跳过表头
var cells = rows[i].getElementsByTagName("td");
for (var j = 0; j < cells.length; j++) {
var previousCell = cells[j - 1];
var newCell = cells[j];
var newInput;
if (j < 6) { // 插入文本框
newInput = document.createElement("input");
newInput.type = "text";
newInput.name = newCell.querySelector("input[type='text']").name;
newInput.value = newCell.querySelector("input[type='text']").value;
} else if (j === 6) { // 插入文本域
newInput = document.createElement("textarea");
newInput.name = newCell.querySelector("textarea").name;
newInput.value = newCell.querySelector("textarea").value;
} else if (j >= 7 && j <= 11) { // 插入文件选择器
newInput = document.createElement("input");
newInput.type = "file";
newInput.name = newCell.querySelector("input[type='file']").name;
newInput.onchange = function () {
previewImage(this);
};
newInput.onclick = function () {
showPopup(this.src);
};
} else if (j === 12) { // 插入文本域
newInput = document.createElement("textarea");
newInput.name = newCell.querySelector("textarea").name;
newInput.value = newCell.querySelector("textarea").value;
}
newCell.innerHTML = "";
newCell.appendChild(newInput);
newCell.style.width = getComputedStyle(previousCell).width;
}
}
}
```
在上述代码中,我们使用`querySelector`方法来获取对应列的输入元素,并从中提取属性名和属性值。然后将这些属性设置到新创建的输入元素中。请注意,这里假设您的表格结构与提供的代码一致,并且属性名能够正确地被提取。
希望这次能满足您的需求。如果您还有其他问题,请随时提问。
阅读全文