选项单击两次

Option click twice

本文关键字：两次 单击 选项      更新时间：2023-09-26

每当我尝试单击下拉列表时，第一个事件是下拉列表中已经加载的内容，第二个事件是我在下拉列表中单击的内容。实际上，有两个事件正在发生，但我只想要第二个点击。

HTML 

<select class="pictureList" id="pictureList">
<option class ="option0" id="option0">select a picture</option>
<option class ="option1" id="option1">picture 1</option>
<option class ="option2" id="option2">picture 2</option>
</select>
Javascript 

document.addEventListener("DOMContentLoaded", function() {
    document.getElementById("pictureList").addEventListener("onkeyup", actionListener, false);
}, false);
function actionListener(event) {
    if(event.target == document.getElementById("pictureList")) {
    loadPicture();
    }
}
function loadPicture() {
    var picture = document.getElementById("pictureList");
    if (picture == "select a picture") 
    load;
    else if (picture == "picture 1")
    load;
    else if (picture == "picture 2")
    load;
 }

所有内容都能正确加载，只是每当我点击列表查看其他选项时，它都会加载列表中已经存在的内容。例如，列表从图片1开始，我想加载图片2。然后点击列表查看选项，图片1再次被加载，然后点击图片2，它也被加载。我不想让图片1再次载入。我也试过onchange，但它仍然会这样做

你可以尝试在addEventListener中使用"change"代替"onkeyup"。
例:. getelementbyid("pictureList")。addEventListener("change"， actionListener, false);

参考url: addEventListener， "change"和选项选择

或更多的帮助，你可以给我的部分代码"mohit.tiwari@techinfini.com"。

相关文章：