使javascript根据下拉菜单中的输入执行操作

Question

I have been trying to make a little web page where you select two items from a drop down menu and press a button and it plays a sound, the sound varying based on what is selected in the drop down menu. 我一直在尝试制作一个小的网页，您可以从下拉菜单中选择两个项目并按一个按钮，然后播放声音，声音会根据下拉菜单中的选择而变化。 Unfortunately I am having trouble with getting my JavaScript to interact with the button and then getting JavaScript to exert what is selected in the drop down. 不幸的是，我无法让我的JavaScript与按钮交互，然后让JavaScript发挥下拉菜单中的所选内容。

Here are some snippets of my basic code: 以下是一些我的基本代码片段：

HTML: HTML：

<head>
    <script src="src/EEEE.js"></script>
</head>
<body>
    <input type="image" id="button" value="submit" src="img/Button.png" onclick="handleClick()"/>
    <br>
    <select id="who">
        <option value="name1">Name 1</option>
        <option value="name2">Name 2</option>
        <option value="name3">Name 3</option>
    </select>
    <select id="what">
        <option value="op1">Option 1</option>
        <option value="op2">Option 2</option>
        <option value="op3">Option 3</option>
    </select>
</body>

JavaScript (in a folder called "src"): JavaScript（在名为“ src”的文件夹中）：

function handleClick(){
    var w1 = document.getElementById("who").value;
    var name = who.options[who.selectedIndex].text;
    if(name == "name1"){
        /*do this*/
    }else if(name == "name2"){
        /*do that*/
    }
}

Answer 1

i have fixed your code, you can see the fixed demo Here 我已经修复了您的代码，您可以在此处查看已修复的演示

basically you should have used 'value' instead of 'text' and attaching event via javscript seems to work. 基本上，您应该使用'value'而不是'text'并且通过javscript附加事件似乎有效。

Answer 2

Using jquery makes it easy: 使用jquery变得容易：

$('#button').click(function(){
    dd1Val = $('#who').val();
    dd2Val = $('#what').val();
    alert(dd1Val + "" + dd2Val);
})

使javascript根据下拉菜单中的输入执行操作

问题描述

2 个解决方案

解决方案1
1 已采纳 2014-03-20 15:36:48

解决方案2
0 2014-03-20 15:36:59

使javascript根据下拉菜单中的输入执行操作

问题描述

2 个解决方案

解决方案1 1 已采纳 2014-03-20 15:36:48

解决方案2 0 2014-03-20 15:36:59

解决方案1
1 已采纳 2014-03-20 15:36:48

解决方案2
0 2014-03-20 15:36:59