如何解决HTML 中的表格和下拉列表
我用 HTML/PHP 创建了下表。我应该这样做，以便当用户从下拉列表中选择颜色时，将无法在后续下拉列表中选择它。如果发生这种情况，请将最近更改的下拉列表还原为先前选择的值。目前，我似乎无法将它恢复到颜色恢复的位置。
<title>Color Coordinate</title>
<style>
table,th,td {
border: 1px solid black;
border-collapse: collapse;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
var values = [];
$(".color").on("change",function () {
$('.color').each(function () {
values.push(this.value);
});
var iRepeatedCount = 0;
for (var i = 0; i < values.length; i++) {
if (this.value == values[i]) {
iRepeatedCount += 1;
}
}
if (iRepeatedCount > 1) {
this.value = "";
}
})
});
</script>
</head>
<body>
<h1>Color Coordinate Generation</h1>
<?PHP
$rowcol = $_GET["rowcol"];
$numColor = $_GET["numColor"];
echo "<table style='width:80%'>";
for($i = 0; $i < $numColor; $i++) {
echo "
<tr>
<td style = 'width: 20%'><label for='color'></label>";
?>
<select name="color" id="color">
<option value='red'>Red</option>
<option value='orange'>Orange</option>
<option value='yellow'>Yellow</option>
<option value='green'>Green</option>
<option value='blue'>Blue</option>
<option value='purple'>Purple</option>
<option value='grey'>Grey</option>
<option value='brown'>brown</option>
<option value='black'>Black</option>
<option value='teal'>teal</option>
</select>
<?PHP
echo "</td>
<td style = 'width: 80%'> </td>
</tr>";
}
echo "
</table>";
?>
<br>
<br>
<?PHP
$alphabet = ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
echo "<table style='width:100%'>";
echo "<td> </td>";
for($i = 0; $i < $rowcol; $i++) {
echo "
<td style = 'width: 2%'>";
echo $alphabet[$i];
}
echo "</td>";
for($i = 1; $i <= $rowcol; $i++) {
echo "<tr>
<td style = 'width: 2%'>";
echo $i;
for($j = 0; $j <$rowcol; $j++) {
echo "
<td style = 'width: 2%'>";
}
}
echo "</td></tr>";
?>
</body>
</html>```
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
