JavaScript 代码中重复 ID 导致的样式错误修复
这段代码的问题在于使用了相同的id值("th"和"tmmc")来多次插入元素。根据HTML规范,id应该是唯一的,不能重复使用。\n\n为了解决这个问题,你可以考虑使用类(class)来标识相同类型的元素,或者使用动态生成的唯一id。下面是修改后的代码:\n\njavascript\nlet vote_vid = 0;\n$("body").on('click', '#dz', function() {\n let subject_sid = \"\";\n var subject_stype = $("#th").val();\n var subject_scontent = $("#tmmc").val();\n $.ajax({\n url: \"/getSubject\";\n type: \"get\";\n dataType: \"json\";\n data: {\n vote_vid: vote_vid,\n subject_stype: subject_stype,\n subject_scontent: subject_scontent\n },\n success: function(data) {\n for (let i = 0; i < data.length; i++) {\n subject_sid = data[i].subject_sid;\n if (data[i].subject_stype === \"x\") {\n $("#th").val(\"单选\");\n } else if (data[i].subject_stype === \"t\") {\n $("#th").val(\"多选\");\n }\n $("#tmmc").val(data[i].subject_scontent);\n\n var table = document.getElementById(\"tab\");\n var row = table.insertRow(0); // 在表格最后插入一行\n var rows = table.insertRow(0);\n\n row.style.display = \"block\"; // 设置新行的display属性为block\n\n if (data[i].subject_stype === \"x\") {\n var aa = row.insertCell(0);\n aa.innerHTML = '<div style=\"display: block;\"; >【<input type=\"text\" class=\"th\" style=\"border: none;width: 50px; color: #00a2d4; white-space: nowrap; \"disabled=\"disabled\">】' +\n '<input type=\"text\" class=\"tmmc\" style=\"border: none; width: 500px \" disabled=\"disabled\"></div><br>';\n\n var radio = rows.insertCell(0);\n radio.innerHTML = '<input type=\"radio\" name=\"ra\"><input type=\"text\" disabled=\"disabled\" >' +\n '<br><input type=\"radio\" name=\"ra\"><input type=\"text\" disabled=\"disabled\" > <br><br> ';\n } else {\n var aa = row.insertCell(0);\n aa.innerHTML = '<div style=\"display: block;\"; >【<input type=\"text\" class=\"th\" style=\"border: none;width: 50px; color: #00a2d4; white-space: nowrap;\" disabled=\"disabled\">】' +\n '<input type=\"text\" class=\"tmmc\" style=\"border: none; width: 500px \" disabled=\"disabled\"></div><br>';\n\n var checkbox = rows.insertCell(0);\n checkbox.innerHTML = '<input type=\"checkbox\" name=\"ch\"><input type=\"text\" disabled=\"disabled\" >' +\n '<br><input type=\"checkbox\" name=\"ch\"><input type=\"text\" disabled=\"disabled\" > <br><br> ';\n }\n }\n\n }\n });\n});\n\n\n在修改后的代码中,使用class属性替代了id属性,并通过类选择器(.th和.tmmc)来获取相应的元素。这样就不会再出现重复的id导致样式错误的问题了。
原文地址: https://www.cveoy.top/t/topic/pZkm 著作权归作者所有。请勿转载和采集!