Question

我目前有一个下拉列表，其中包含一些值，我想知道是否可以在下拉列表旁边显示一个与下拉列表中的值相对应的图像？这是我的下拉列表的代码。如果您需要更多信息，请询问。

<form id="formddl">
            <a id="infoheader">GreenB Colour</a> <br><br>
            <div class="header">
                <select>
                    <option value="0">Ivory White</option>
                    <option value="1">Carbon Black</option>
                </select>
            </div>   <br><br>       

            <script src="fancystyle1/js/jquery.simple.select.js"></script>
            <script type="text/javascript">
                $(function() {
                    $('select').selectBoxes();  
                });             
            </script>
        </form>

Answer 1

你可以这样做：

$("#iama").children().click(function changeImage(){
var value = $("#iama option:selected").val();
  if (value == 1){
  
  $("#image").attr("src","http://lorempixel.com/400/200/");
  }
  else {
    $("#image").attr("src","http://lorempixel.com/600/200/");
  }
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<select id="iama">
  <option value=1>image for value 1</option>
  <option value=2>image for another value</option>
</select>
<img id ="image" src="http://lorempixel.com/200/200/"/>

将图像链接到下拉列表中的值

1 个答案: