![](/img/trans.png)
[英]how to get checked value from a list of dynamically selected created checkboes?
[英]How to get value of dynamically created dropdown list?
我在我的 DOM 中实例化一个用户列表,然后将他们的名字绑定到下拉列表中。 所以它们在页面加载之前不会被创建。 我在尝试定位<option>
标记并访问它的值时遇到问题。
JS DOM 函数
let userDropDownList = userInstantiation.reduce((usersHTML, user) => {
usersHTML += `<option class="nav__div__one__dropdown__choice" value="${user.id}">${user.name}</option>`
return usersHTML;
}, '')
navDivDropdown.innerHTML = userDropDownList
}
我试图遍历<option>
标签,但我返回一个空数组。 我的index.html
包装器是<select class="nav__div__one__dropdown" name="users"></select>
我正在尝试获取该值,以便我可以将 user.id 绑定到 User 实例并访问这些类方法。 任何提示将非常感谢!
您可以在选择输入上使用onchange
事件,如下所示:
<select onchange="changed(this)"></select>
function changed(option){
console.log(option.value);
}
这是一个工作片段
let userInstantiation = [{id: 1, name: 'user1'},{id: 2, name: 'user2'}]; let userDropDownList = userInstantiation.reduce((usersHTML, user) => usersHTML += `<option class="nav__div__one__dropdown__choice" value="${user.id}">${user.name}</option>` , '') document.querySelector(".nav__div__one__dropdown").innerHTML = userDropDownList; function changed(option){ console.log(option.value); }
<select class="nav__div__one__dropdown" onchange="changed(this)" name="users"></select>
你会这样做
document.querySelector('nav__div__one__dropdown').addEventListner('change',(e)=>{
const userId=e.target.value;
//here do your user tying logic
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.