我目前正试图让用户选择他们想要使用的图标，一旦选择到下一页，我将得到张贴的值。这是我为用户提供的选项…下面是另一个页面的代码
<div id="accordion">
<h3><input type="submit" name="dog" value="Select" />Dogs</h3>
<div>
<table width="100%" border="0">
<tr>
<td><img src="dog/128_dog3.png" width="128" height="128" alt=""></td>
<td><img src="dog/dog (1).png" width="128" height="128" alt=""></td>
<td><img src="dog/dog (2).png" width="128" height="128" alt=""></td>
<td><img src="dog/dog.png" width="128" height="128" alt=""></td>
<td><img src="dog/dog1.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="dog/hp_dog.png" width="128" height="128" alt=""></td>
<td><img src="dog/ps_sirius_dog_black.png" width="128" height="128" alt=""></td>
<td><img src="dog/ps_sirius_dog_blue.png" width="128" height="128" alt=""></td>
<td><img src="dog/sleeping_old_dog.png" width="128" height="128" alt=""></td>
</tr>
</table>
</div>
<h3><input type="submit" name="cat" value="Select" />Cats</h3>
<div>
<table width="100%" border="0">
<tr>
<td><img src="cat/cat (1).png" width="128" height="128" alt=""></td>
<td><img src="cat/cat (2).png" width="128" height="128" alt=""></td>
<td><img src="cat/cat (3).png" width="128" height="128" alt=""></td>
<td><img src="cat/cat (4).png" width="128" height="128" alt=""></td>
<td><img src="cat/cat (5).png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="cat/cat (6).png" width="128" height="128" alt=""></td>
<td><img src="cat/cat.png" width="128" height="128" alt=""></td>
<td><img src="cat/cat_2.png" width="128" height="128" alt=""></td>
<td><img src="cat/cat_6_2.png" width="128" height="128" alt=""></td>
<td><img src="cat/hp_cat.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="cat/package_toys.png" width="128" height="128" alt=""></td>
</tr>
</table>
</div>
<h3><input type="submit" name="fish" value="Select" />Fish</h3>
<div>
<table width="100%" border="0">
<tr>
<td><img src="fish/1_fish.png" width="128" height="128" alt=""></td>
<td><img src="fish/2_fish.png" width="128" height="128" alt=""></td>
<td><img src="fish/aqua_3.png" width="128" height="128" alt=""></td>
<td><img src="fish/findingnemo1.png" width="128" height="128" alt=""></td>
<td><img src="fish/findingnemo2.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="fish/findingnemo3.png" width="128" height="128" alt=""></td>
<td><img src="fish/findingnemo4.png" width="128" height="128" alt=""></td>
<td><img src="fish/findingnemo5.png" width="128" height="128" alt=""></td>
<td><img src="fish/fish (2).png" width="128" height="128" alt=""></td>
<td><img src="fish/fish.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="fish/fish2.png" width="128" height="128" alt=""></td>
<td><img src="fish/gnome_fish.png" width="128" height="128" alt=""></td>
<td><img src="fish/jelly_fish.png" width="128" height="128" alt=""></td>
<td><img src="fish/wireshark.png" width="128" height="128" alt=""></td>
</tr>
</table>
</div>
<h3><input type="button" name="zoo" value="Select" />Zoo</h3>
<div>
<table width="100%" border="0">
<tr>
<td><img src="zoo/big_foot.png" width="128" height="128" alt=""></td>
<td><img src="zoo/dolphin.png" width="128" height="128" alt=""></td>
<td><img src="zoo/frank.png" width="128" height="128" alt=""></td>
<td><img src="zoo/hippopotamus.png" width="128" height="128" alt=""></td>
<td><img src="zoo/ksnake.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="zoo/mammoth_seated.png" width="128" height="128" alt=""></td>
<td><img src="zoo/panda.png" width="128" height="128" alt=""></td>
<td><img src="zoo/penguin (1).png" width="128" height="128" alt=""></td>
<td><img src="zoo/penguin.png" width="128" height="128" alt=""></td>
</tr>
</table>
</div>
<h3><input type="button" name="xmas" value="Select" />Xmas</h3>
<div>
<table width="100%" border="0">
<tr>
<td><img src="xmas/ball_red_1.png" width="128" height="128" alt=""></td>
<td><img src="xmas/candycane.png" width="128" height="128" alt=""></td>
<td><img src="xmas/christmas_santa_christmas_2.png" width="104" height="131" alt=""></td>
<td><img src="xmas/christmas_tree.png" width="128" height="128" alt=""></td>
<td><img src="xmas/gift.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="xmas/golden_ball.png" width="128" height="128" alt=""></td>
<td><img src="xmas/jingle.png" width="128" height="128" alt=""></td>
<td><img src="xmas/mistletoe.png" width="128" height="128" alt=""></td>
<td><img src="xmas/present.png" width="128" height="128" alt=""></td>
<td><img src="xmas/recycle_bin_full.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="xmas/snowman2.png" width="96" height="96" alt=""></td>
<td><img src="xmas/xmas_08.png" width="128" height="128" alt=""></td>
<td><img src="xmas/xmas_09.png" width="128" height="128" alt=""></td>
<td><img src="xmas/xmas_14.png" width="128" height="128" alt=""></td>
<td><img src="xmas/xmas_17.png" width="128" height="128" alt=""></td>
</tr>
</table>
</div>
<h3><input type="button" name="pen" value="Select" />Pengins</h3>
<div>
<table width="100%" border="0">
<tr>
<td><img src="pengins/angola.png" width="128" height="128" alt=""></td>
<td><img src="pengins/argentina.png" width="128" height="128" alt=""></td>
<td><img src="pengins/brazil.png" width="128" height="128" alt=""></td>
<td><img src="pengins/croatia.png" width="128" height="128" alt=""></td>
<td><img src="pengins/ecuador.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="pengins/england.png" width="128" height="128" alt=""></td>
<td><img src="pengins/france.png" width="128" height="128" alt=""></td>
<td><img src="pengins/iran.png" width="128" height="128" alt=""></td>
<td><img src="pengins/italy.png" width="128" height="128" alt=""></td>
<td><img src="pengins/japan.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="pengins/korea_republic.png" width="128" height="128" alt=""></td>
<td><img src="pengins/mexico.png" width="128" height="128" alt=""></td>
<td><img src="pengins/saudi_arabia.png" width="128" height="128" alt=""></td>
<td><img src="pengins/serbia_montenegro.png" width="128" height="128" alt=""></td>
<td><img src="pengins/spain.png" width="128" height="128" alt=""></td>
</tr>
<tr>
<td><img src="pengins/sweden.png" width="128" height="128" alt=""></td>
<td><img src="pengins/switzerland.png" width="128" height="128" alt=""></td>
<td><img src="pengins/tunisia.png" width="128" height="128" alt=""></td>
<td><img src="pengins/ukraine.png" width="128" height="128" alt=""></td>
<td><img src="pengins/usa.png" width="128" height="128" alt=""></td>
</tr>
</table>
</div>
</div>
下一页…
位于/index.php
if ($_POST['dog']){ $currentArr = $dogArr;}
elseif($_POST['fish']){ $currentArr = $fishArr;}
elseif($_POST['cat']){ $currentArr = $catArr;}
elseif($_POST['zoo']){ $currentArr = $zooArr;}
elseif($_POST['xmas']){ $currentArr = $xmasArr;}
elseif($_POST['penguin']){ $currentArr = $penginArr;}
有人有什么建议吗?
将每个图像转换成一个表单，作为'send'按钮，然后为每个表单添加一个包含字段名称的隐藏字段。在input type = "image"中查看更多信息
就像这样。虽然我建议使用PHP自动生成这些表单，但这对初学者来说可能有点棘手:
<div id = "animals">
<!-- First animal -->
<form action = "/index.php" method = "POST">
<input type = "hidden" name = "type" value = "dog"><br>
<input type = "hidden" name = "specific" value = "128_dog3"><br>
<input type = "image" src = "dog/128_dog3.png"/>
</form>
<!-- Second animal -->
<form action = "/index.php" method = "POST">
<input type = "hidden" name = "type" value = "dog"><br>
<input type = "hidden" name = "specific" value = "dog (1)"><br>
<input type = "image" src = "dog/dog (1)png"/>
</form>
<div id = "animals">
然后，在index.php中，您将执行:
// If to avoid someone submitting empty forms
if (!empty($_POST['type']) && !empty($_POST['specific']))
switch($_POST['type'])
{
case 'dog': $currentArr = $dogArr; break;
case 'fish': $currentArr = $fishArr; break;
case 'cat': $currentArr = $catArr; break;
case 'zoo': $currentArr = $zooArr; break;
default: echo "Sorry, select one of the icons available"; break;
}
// Now $currentArr holds the specie (dog, fish, penguin, etc) and $_POST['specific'] the race
最后但并非最不重要的是，出于明显的原因(页面重量和保持你的代码DRY)，我建议把这个放在你的style.css中，将你的输入图像格式化为128x128像素:
#animals form input
{
width: 128px;
height: 128px;
}
标记上的表单按钮无论如何都不与相应的表选项相关联，尽管它们位于同一页面上。我会考虑根据单击按钮的值从数据库表中提取值。
您需要将每个情况下的值从"Submit"更改为适当的数组，例如("pen"或"xmas")。然后在后续页面上，使用Where子句从数据库表中提取所需的值和传入的按钮值(假设您使用的是db)，或者在接收页面上加载适当的数组。