Question

我想在选择下拉菜单中的选项后显示图片。图片将取决于用户选择的值。我试图这样做（请记住，我还没有学过JavaScript，我只知道2或3个基本功能，感谢谷歌）：

showpic.js

document.getElementById('item').onchange = function(){
    document.getElementById('ipic').style.display = "block";
    document.getElementById('ipic').innerHTML = "<img src='http://example.com/pics/" + this.value + "'.png";
};

为方便起见，没有PHP代码的

items.php

<div id='ia'>
<form action='add_items.php' method='post'>
Username: <input name='username' type='username'> <br />
Password: <input name='password' type='password'> <br />
Item:     <select name='item' id='item'>
              <option value='100'>Example</option>
              <option value='200'>Example 2</option>
          </select>
<script src='sort.js'></script> <br/> <!-- Sorts Items in Alphabetical Order -->
<div id='ipic'></div>
<script src='showpic.js'></script>
<input name='add' type='submit' value='Add Item'>
</form>
</div>

但那没用。我听说这与“XMLHTTPREQUEST”＆amp; AJAX。谁能帮我？我不懂JavaScript。

Answer 1

我不确定你认为你需要AJAX，但你的脚本几乎可以使用！

"<img src='http://example.com/pics/" + this.value + "'.png";

此部分已中断，因为您启动了<img元素但从未关闭它（/>）。

将其更改为：

document.getElementById('ipic').innerHTML = "<img src='http://example.com/pics/" + this.value + "'.png' />";

现在它会尝试在该div中加载名为 [value] .png的图片

选择下拉菜单选项后显示图片

1 个答案: