Javascript 下拉菜单onchange事件只针对一个功能

Question

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

        <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>

Javascript 下拉菜单onchange事件只针对一个功能

Javascript drop down menu onchange event only for one fuction

html

javascript

events

onchange

drop-down-menu