Javascript 添加了“列表器”；更改“；和选项选择

我试图让动态选择列表从单个选择开始填充自己：

<select id="activitySelector">
      <option value="addNew">Add New Item</option>
</select>

---

问题是，当您有一个项目时，各种事件不会触发：不是“更改”，因为当您选择该项目时，文本没有什么不同；不是“选择”（正如我在这里所说的），原因大致相似，因为我没有真正选择任何东西，因为只有一个项目。这里应该触发什么事件？在我的选项列表中列出一个空白项来触发事件似乎很愚蠢，因此我希望有另一种解决方案。或者这是最好的解决方案吗？

您需要一个单击侦听器，如果存在少于2个选项，它将调用

addActivityItem

：

var activities = document.getElementById("activitySelector");

activities.addEventListener("click", function() {
    var options = activities.querySelectorAll("option");
    var count = options.length;
    if(typeof(count) === "undefined" || count < 2)
    {
        addActivityItem();
    }
});

activities.addEventListener("change", function() {
    if(activities.value == "addNew")
    {
        addActivityItem();
    }
});

function addActivityItem() {
    // ... Code to add item here
}

var activities=document.getElementById（“activitySelector”）；
activities.addEventListener（“单击”，函数（）{
var options=activities.querySelectorAll（“选项”）；
var count=options.length；
if（typeof（count）==“未定义”| | count<2）
{
addActivityItem（）；
}
});
activities.addEventListener（“更改”，函数（）{
如果（activities.value==“addNew”）
{
addActivityItem（）；
}
});
函数addActivityItem（）{
//…在此处添加项目的代码
}

---

现场演示是。

问题是您使用了选择选项，这就是您出错的地方选择表示文本框或文本区域有焦点。 您需要做的是使用更改。 “当在选择元素中做出新选择时激发”，在远离文本框或文本区域时也像模糊一样使用

function start(){
      document.getElementById("activitySelector").addEventListener("change", addActivityItem, false);
      }

function addActivityItem(){
      //option is selected
      alert("yeah");
}

window.addEventListener("load", start, false);

---

似乎您想让它触发一个单独的onclick处理程序来检查项目的数量，如果只有一个，则调用addActivityItem。我想我只是想知道当我单击只有一个项目的select项目时，会触发什么事件（如果有），因为现在应该触发的事件不会发生。如果单击，将触发单击事件。如果要触发选择事件，可以显式触发document.getElementById（'activitySelector'）。click（）我意识到错误在代码中的其他地方，而click事件毕竟是我想要的。这就是我所做的，也是我一直在思考的，所以确认是好的。非常感谢。在您的示例链接中，编写了

changed

event，我认为应该是

change

谢谢，当我将（）添加到事件侦听器中的函数调用时，这对我起到了作用，如“…addEventListener（“change”，addActivityItem（），false”）

function start(){
      document.getElementById("activitySelector").addEventListener("change", addActivityItem, false);
      }

function addActivityItem(){
      //option is selected
      alert("yeah");
}

window.addEventListener("load", start, false);