1

我无法从下拉菜单中访问选定的值。当我尝试访问在 javascript 函数 displayPhoto 中选择的值时，根本没有访问任何值（我试图在文本字段中打印出来）。难道我做错了什么？谢谢！

这是 HTML 部分：

<form id="colorChoice">
    <img id="photo" src="red.jpg" alt="red" />
    <select name="color" size=5>
         <option value="red" onclick="jsFunction()">Red</option>
         <option value="blue" onclick="jsFunction()">Blue</option>
         ...
    </select>
</form>

（我已经尝试过'onclick'和'onchange'，两者都不起作用。）

这是Javascript部分：

function jsFunction(){
    var imageFile; = document.getElementById("colorChoice").color.value + ".jpg";
    ...
}
4

3 回答 3

2

你需要穿上元素onchange。select

<form id="colorChoice">
    <img id="photo" src="red.jpg" alt="red" />
    <select name="color" id="color" size="5" onchange="jsFunction()">
         <option value="red">Red</option>
         <option value="blue">Blue</option>
         ...
    </select>
</form>

在你的函数前面还有一个;imageFile

function jsFunction(){
 var imageFile = document.getElementById('color').value + '.jpg';
 alert(imageFile);
}
于 2013-07-15T14:55:55.143 回答
0

你的 HTML 部分是这样的

<form id="colorChoice">
    <img id="photo" src="red.jpg" alt="red" />
    <select name="color" size="5" onchange="jsFunction()">
         <option value="red">Red</option>
         <option value="blue">Blue</option>
         ...
    </select>
</form>

你的 jscript 部分会是这样的

function jsFunction(){
    var imageFile = document.getElementById("colorChoice").color.value + ".jpg";
    ...
}
于 2013-07-15T15:01:42.940 回答
0

使用 getElementById 时，不能通过“名称”属性选择项目。而是为选择标签设置一个 ID，如下所示：

    <form id="colorChoice">
        <img id="photo" src="red.jpg" alt="red" />
        <select id="color" size="5" onchange="jsFunction()">
             <option value="red">Red</option>
             <option value="blue">Blue</option>
             ...
        </select>
    </form>

然后让你的js如下：

function jsFunction(){
    var imageFile = document.getElementById("color").value + ".jpg";
    ...
}

另请注意，我已按照上述答案的建议采取了 onchange() 事件。

于 2013-07-15T15:07:32.870 回答