Question

我正在动态创建一个menulist弹出列表。我的可编辑和开放属性为true。我希望能够做的是当用户键入一个尚未存在的项目时能够添加新的menulist项目。这可能吗？如果是这样，怎么样？

我正在创建这样的列表：

var ml = document.createElement("menulist");
ml.setAttribute("editable","true");
ml.setAttribute("open","true");
ml.setAttribute("oncommand","alert(this.value)");
var mp = document.createElement("menupopup");
var mi = document.createElement("menuitem");
mi.setAttribute("label","item1");
mi.setAttribute("value","1");
mp.appendChild(mi);
//add as many items as i feel
ml.appendChild(mp);

当值更改时，更改项目时会触发警报功能，但是当我输入任何内容时，它不会被触发。基本上，我想最终将值传递给我从此处调用的函数，以将该项添加到列表中。

Answer 1

首先，您应该认真考虑使用addEventListener而不是更改oncommand等属性：

ml.addEventListener("command", function(event) {
 alert(this.value);
}, false);

如果您希望收到有关文本字段更改的通知，那么您应该在文本字段中添加一个事件监听器：

ml.appendChild(mp);
ml.inputField.addEventListener("input", function(event)
{
  alert("Text field value changed");
}, false);

请注意，必须在将元素添加到文档之后完成此操作，之后将不会定义inputField属性（相应的XBL绑定尚未应用）。

供参考：menulist.inputField，input event

在用户输入项目时，将项目添加到可编辑的menulist

1 个答案: