【发布时间】：2019-06-23 19:30:32
【问题描述】：
我正在做一个学校项目，我需要一些建议。这是一个 HTML/PHP/SQL 项目，用户可以在其中提供有关游戏体验的意见。作为管理员，您必须能够查看为某些游戏类别选择的用户的姓名。这需要使用 PHP 和 MySQL 在表中显示。
我现在已经完成了这个页面，它就像一个魅力，我可以看到所有用户的输入。但问题是我有大约 600 行代码，因为我有 12 个带有 MySQL 语句和表的不同 div。
目前我的代码分为 3 部分，html 选择下拉菜单，12 个不同的 div 和查询生成表格，jquery 显示/隐藏基于下拉列表的表格
我希望有人可以就如何缩短我的代码给我一个建议，因为 600 行代码太疯狂了，我知道它可能会更短，但我就是不知道怎么做。
<select name="type" id="type" style="margin-left:57px; width:153px;">
<option name="select" value="select">Selecteren..</option>
<optgroup label="Hoe spelen mensen?">
<option name="alleen" value="alleen">Meestal alleen</option>
<option name="fysiek" value="fysiek">Meestal samen fysiek</option>
<option name="online" value="online">Meestal samen online</option>
</optgroup>
<optgroup label="Categorieën bordspellen">
<option name="alleen" value="kaartspellen">Kaartspellen</option>
<option name="fysiek" value="strategische">Strategische bordspellen</option>
<option name="online" value="fantasy">Fantasy bordspellen</option>
<option name="online" value="klassiek">Klassieke gezelschapspellen</option>
</optgroup>
<optgroup label="Categorieën computergames">
<option name="alleen" value="sport">Sport games</option>
<option name="fysiek" value="adventure">Adventure games</option>
<option name="online" value="war">War games</option>
<option name="online" value="strategischegames">Strategische games</option>
</optgroup>
<optgroup label="Gebruikers">
<option name="alle" value="alle">Alle gebruikers</option>
</optgroup>
1 个带有表格的 div（例如，因为有 12 个不同的表格）
<div class="row" id="wargames">
<?php
$war = "SELECT * FROM form where categorie = 'wargames'";
$querywar = mysqli_query($conn, $war);
if (!$querywar) {
die('SQL Error: ' . mysqli_error($conn));
}
?>
<table class="data-table">
<caption class="title">Deze mensen spelen meestal de categorie War
games</caption>
<thead>
<tr>
<th>Naam</th>
<th>Woonplaats</th>
<th>E-mail</th>
</tr>
</thead>
<tbody>
<?php
while ($row = mysqli_fetch_array($querywar)) {
echo '<tr>
<td style="text-align:center">' . $row['naam'] . '</td>
<td style="text-align:center">' . $row['woonplaats'] .
'</td>
<td style="text-align:center">' . $row['email'] . '</td>
</tr>';
}
?>
</tbody>
</table>
我的 jquery
$(function() {
$('#row_dim').hide();
$('#type').change(function(){
if($('#type').val() == 'alleen') {
$('#alleen').show();
} else {
$('#alleen').hide();
}
if($('#type').val() == 'fysiek') {
$('#fysiek').show();
} else {
$('#fysiek').hide();
}
if($('#type').val() == 'online') {
$('#online').show();
} else {
$('#online').hide();
}
if($('#type').val() == 'kaartspellen') {
$('#kaartspellen').show();
} else {
$('#kaartspellen').hide();
}
if($('#type').val() == 'strategische') {
$('#strategische').show();
} else {
$('#strategische').hide();
}
if($('#type').val() == 'fantasy') {
$('#fantasy').show();
} else {
$('#fantasy').hide();
}
if($('#type').val() == 'klassiek') {
$('#klassiek').show();
} else {
$('#klassiek').hide();
}
if($('#type').val() == 'sport') {
$('#sportgames').show();
} else {
$('#sportgames').hide();
}
if($('#type').val() == 'adventure') {
$('#adventure').show();
} else {
$('#adventure').hide();
}
if($('#type').val() == 'war') {
$('#wargames').show();
} else {
$('#wargames').hide();
}
if($('#type').val() == 'strategischegames') {
$('#strategischegames').show();
} else {
$('#strategischegames').hide();
}
if($('#type').val() == 'select') {
$('#selected').show();
} else {
$('#selected').hide();
}
if($('#type').val() == 'alle') {
$('#gebruikers').show();
} else {
$('#gebruikers').hide();
}
});
$( document ).ready(function() {
if($("#type").attr("selectedIndex") !== 0) {
$('#selected').show();
$('#strategischegames').hide();
$('#wargames').hide();
$('#adventure').hide();
$('#sportgames').hide();
$('#klassiek').hide();
$('#fantasy').hide();
$('#strategische').hide();
$('#kaartspellen').hide();
$('#online').hide();
$('#fysiek').hide();
$('#alleen').hide();
$('#gebruikers').hide();
}
});
});
【问题讨论】：