如何将选择菜单的值传递给单击事件

how to pass a value of a select menu to the on-click event

本文关键字：单击事件值传选择菜单更新时间：2023-09-26

我试图将选择菜单的选定选项提供给onclick函数事件。我要做的html代码是这个

<select id="tag1"onclick="selectOnclick(tag1.value)" >

但是，由于我必须在java-script中制作选择菜单及其选项，谁能给我一个java脚本代码，即传递给函数的选定值是在java-script中制作的选择菜单的值。这是我写的代码，但不工作:

 tag=document.createElement("div")
 tag.id="tag";
 document.body.appendChild(tag);     
 tagmenu=document.createElement("select");
 tagmenu.id="tag1";
 tag.appendChild(tagmenu);
 //
 allTags=document.createElement("option");
 allTags.innerHTML="ALL";
 tagmenu.appendChild(allTags);
 tagmenu.onclick=selectOnclick(tagmenu.value);

Replace

tagmenu.onclick=selectOnclick(tagmenu.value);

if (tagmenu.addEventListener) {  // all browsers except IE before version 9
    tagmenu.addEventListener("click", function(){selectOnclick(tagmenu.value);}, false);
} else {
  if (tagmenu.attachEvent) {   // IE before version 9
      tagmenu.attachEvent("click", function(){selectOnclick(tagmenu.value);});
  }
}

感谢这个答案

演示

您可以获得相同的结果，而不需要在元素上添加id。只需将"this"传递给您的函数…或者在您的情况下，如果您只想要值，则传入"this.value":

<select onclick="doSomething(this.value)">
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

function doSomething(x) {
    console.log(x);
}

给你一把小提琴。

更新:

这是一个更新的小提琴

HTML:

<div id="menu"></div>

Javascript:

function doSomething(x) {
    var target = x.target;
    if (target.tagName === 'OPTION') {
        target = target.parentNode;
    }
    console.log(target.value);
}
function createMenu() {
    var menu = document.getElementById('menu'),
        select = document.createElement('select'),
        option,
        i;
    for (i = 0; i < 10; i++) {
        option = document.createElement('option');
        option.value = option.text = i;
        select.add(option);
    }
    menu.appendChild(select);
    select.onclick = doSomething;
}
createMenu();

这里有一些关于SO的引用:

为javascript添加选项
为javascript中新添加的元素添加onclick事件
jQuery:查找

对于