显示一个特定的图形变化 - Showing a specific graphic onchange

Showing a specific graphic onchange

本文关键字：图形变化一个显示 | 更新日期: 2023-09-27

我目前有一段JavaScript，它从PHP动态下拉菜单中获取值和选定的文本，并将其传递到输入框中进行编辑。

问题:

我如何通过JavaScript传递一个PHP项目，以显示选定值时的特定图像?

如何使选中的文本在选择时返回到输入框中?

 $('#captionSelect').change(function(){
                    $('#captionInput').val($("#captionSelect option:selected").html()).show();
                });
<select name="captionSelect" id="captionSelect">
    <?php foreach ($get_images as $image){
        echo '<option value="'.$image['id'].'">'.$image['description'].'</option>';
    };
    ?>
    
</select>

<select name="captionSelect" id="captionSelect">
    <?php
        foreach ($get_images as $image){
            echo '<option title="'.$image['thumbname'].'" value="'.$image['id'].'" id="captionOption_'.$image['id'].'">'.$image['description'].'</option>';
        };
    ?>
</select>
<input id="captionInput" type="text" />
<img id="preview" />
<script type="text/javascript">
    $('#captionSelect').change(function(){
        var id = $(this).val();
        var caption = $('#captionOption_' + id).html();
        var thumbname = $('#captionOption_' + id).attr('title');
        $('#captionInput').val(caption);
        $('#preview').attr('src', '/path/to/pictures/' + thumbname + '.jpg');
    });
</script>