Javascript 下拉菜单 onchange 事件仅适用于一项功能

Question

这就是我想要实现的：在下面的函数中，当下拉菜单发生变化时，函数将从文本框中获取值并执行查找。我不想在<select> 标签中添加onchange，因为下拉菜单中还有其他功能。我可以只在下面的这个函数中添加一个 on change 吗？非常感谢！

        <select id="types"> 
            <option value ="food">food</option>
            <option value ="drinks">drinks</option>
        <select>
           function lookup(){
                    var keyword = input.value;//get value from text box
                    var type = document.getElementById("types").value;//get value from drop down menu
                    if (search=="food"){
                    //perform look up
                    //I 'm trying to make it do another search when the type from the drop down menu changes
                }else{

                }       
            } 

Answer 1

您可以像这样添加事件处理程序

window.addEventListener('change', function(e) {
    if (e.target.id == "types") {
        lookup(e.target);
    }
});

function lookup(){
  
    alert("here now...");
    return ; // temp exit
  
    
    var keyword = input.value;//get value from text box
    var type = document.getElementById("types").value; //get value from drop down menu
    if (search=="food"){
        //perform look up
        //I 'm trying to make it do another search when 
        //the type from the drop down menu changes
    }else{

    }       
} 

<select id="types"> 
    <option value ="food">food</option>
    <option value ="drinks">drinks</option>
<select>