Question

上有这段代码

我的代码的图片部分正常工作，每当您选择一个值时，它都会更改图片。

我想要显示的是值的实际名称“图像1”..所以图像1等。

我经历了stackoverflow并找到了一些例子，我试图实现它们，但我无法让它工作。

所以简而言之，当你选择一个值......它会显示图片而在空div中会显示一个名称

$(document).ready(function() {

   $("#image").change(function() {
     $("#imagePreview").empty();
        $("#imagePreview").append("<img src=\"" + $("#image").val()  + "\" />");
   }).change();
 });

$('#image option:selected').text(); {

   $( "div" ).text( str );
}

<select name="image" id="image" class="inputbox" size="1">
   <option value="imageall.jpg" selected> - All - </option>
   <option value="image1.jpg">image1.jpg</option>
   <option value="image2.jpg">image2.jpg</option>
   <option value="image3.jpg">image3.jpg</option>
</select>

<div id="imagePreview">
   displays image here
</div>

<div></div>

编辑：这样的事情：EXAMPLE

Answer 1

尝试，

$(document).ready(function () {
    $("#image").change(function () {
        $("#imagePreview").empty();
        $("#imagePreview").append("<img src=\"" + $(this).val() + "\" />");
        $("div:last").text($('option:selected', this).text());
    }).change();
});

下拉列表（选择框）获取选择名称

1 个答案:

DEMO