Php 如何在窗体上显示图像选择框更改

我正在尝试在表单中创建一个选择框，并在其旁边的选择框中显示选中的图像。我知道它需要jquery之类的东西，但我对此一无所知。如果有人能帮我或给我指出正确的方向，那就太棒了

<table width="100%">
    <tr>
        <td>
            <select id="icon" name="icon" class="form-control select2">
            <?php foreach ($icons as $icon) { ?>
                <option value="<?php echo $icon['link']; ?>">
                    <?php echo $icon['name']; ?>
                </option>
            <?php } ?>
            </select>
        </td>
        <td align="center" id="iconPreview">
            Image Here
        </td>
    </tr>
</table>

我找到了这个jquery代码段，但它没有显示任何更改

JQuery：

<script>
     $(document).ready(function() {
       $("#icon").change(function() {
         $("#iconPreview").empty();
         if ( $("#icon").val()!="" ){
            $("#iconPreview").append("<img src=\"" + $("#icon").val()  + "\" />");
         }
         else{
            $("#iconPreview").append("displays image here");
         }
       });
     });
</script>

---

如果要在头部使用jQuery，则需要添加jQuery，因此在文档的“添加此行”中：

<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>

然后给TD你想要的图片在一个类中：

<td class="imageHere" align="center" id="seleced_image">

然后，在页面或.js页面的底部添加以下内容：

<script>
    $(function(){
        $('#icon').change(function(){
            var image = $('#icon').val();
            $('#seleced_image').html("<img src='" + image + "' alt='description' />");
        });
    });
</script>

这个jQuery表示每当图标下拉列表更改时，将图像加载到

这是在不学习任何jQuery的情况下完成此任务的最简单方法。否则，我建议您学习jQuery或更好的javascript

所作的修改：

---

在这样的情况下，使用IDs比使用类更好。

看起来很简单，但我知道图像的链接来自php，那么我如何添加它，而不是在jquery代码中的image变量中设置路径？您可以使用php加载图像，并使用CSS将其隐藏，然后可以使用var image=$'.image'.src；用它way@rackemup420，请记住，这只是我的想法，可能不是最好的方法，尤其是如果你有很多TDs和很多图像。但是我只能回答你提出的问题。在选择框中最多有10张图片。我不知道在哪里添加var image=$'.image'.src；你能用它更新你的答案吗？还有一段关于如何在php中调用它的代码？我有点困惑lol@rackemup420，好的，我已经更新了我的答案，以显示图像从何处提取图像源。我假设图像源是选择框的实际值？