使javascript基于下拉菜单中的输入执行一个操作

make javascript preform an action based on input in drop down menus

本文关键字：操作 一个 执行 输入 javascript 下拉菜单      更新时间：2023-09-26

我一直在尝试做一个小网页，你从一个下拉菜单中选择两个项目，按下一个按钮，它播放的声音，声音变化基于什么是在下拉菜单中选择。不幸的是，我有麻烦让我的JavaScript与按钮交互，然后让JavaScript发挥什么是下拉菜单中选择。

下面是我的一些基本代码片段:

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(在名为"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*/
    }
}

我已经修复了你的代码，你可以在这里看到修复的演示

基本上你应该使用'value'而不是'text'和附加事件通过javascript似乎工作。

使用jquery很容易:

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