asp.net - Asp.net 无需重新加载页面即可将下拉列表更改为显示图像

Question

我的脚本是

   function changeType(photoChoice) {
        document.getElementById('images').src = photoChoice;

    }

我的代码是

 <asp:DropDownList ID="DropDownList1" onchange="javascript:changeType(this.options[this.options.SelectedItem].value)" runat="server" >
     <asp:ListItem >-----Select-----</asp:ListItem>
        <asp:ListItem value="~/Image/wedding-cake.jpg">wedding-cake</asp:ListItem>
        <asp:ListItem value="~/Image/Wedding-Cake_heart-cake.jpg">Wedding-Cake_heart-cake</asp:ListItem>
        <asp:ListItem value="~/Image/Whimsical-wedding-cake.jpg">Whimsical-wedding-cake</asp:ListItem>
    </asp:DropDownList>
</div>
<div>
<img src="" id="images" alt="Sample Image" width="300px" />

下拉选择不显示图像。我只有在本地文件夹中有一个图像。传递给函数的 Listitem 值。ListItem 值是图像名称和路径。如何在不重新加载页面的情况下显示我的本地图像。