在DOM上单击按钮后如何调用函数答案

【问题标题】：How do i call a function after a button has been clicked on DOM在DOM上单击按钮后如何调用函数
【发布时间】：2014-05-13 17:31:19
【问题描述】：

我有一个测试按钮设置，当它被点击时，它能够显示一个警报或确认窗口。但是我希望它显示一个项目列表，我有列表的代码，但是当单击按钮时我似乎无法将其显示出来。我正在使用所有 DOM，所以不需要 jquery。谢谢你

var creatbtndiv = document.createElement("div");
var creatbtn = document.createElement("button");
creatbtn.innerHTML = "Click Me";

creatbtndiv.appendChild(creatbtn);

document.body.appendChild(creatbtndiv);



var list = function (name) {
    var creatDiv = document.createElement("div");
    creatDiv.id = "submenudiv";
    creatDiv.className = "submenudiv";

    var creatul = document.createElement("ul");
    for(i = 0; i < 5; ++i){
    li = doument.createElement("li");
    li.innerHTML = "Submenu" + index;
    creatul.appendChild(li);
    }

    creatDiv.appendChild(creatul);

    document.body.appendChild(name);


};



creatbtndiv.onclick = function () {
    var alert = confirm("yes master");
    list();
};

【问题讨论】：

您的控制台是否给您一条错误消息？（顺便说一句，很适合香草）
这适用于jsfiddle.net - 呃，抱歉，我只看到了弹出窗口，而不是列表。

标签： javascript function dom button onclick

【解决方案1】：

您的代码存在一些语法错误。像doument，并使用变量index，它应该是i。在 List 方法的最后，在 document.body.appendChild 上，您应该将 creatDiv 作为参数传递。
看起来像一些 CopyPaste 错误...

http://jsfiddle.net/ayvNZ/

这是工作代码：

var creatbtndiv = document.createElement("div");
var creatbtn = document.createElement("button");
creatbtn.innerHTML = "Click Me";

creatbtndiv.appendChild(creatbtn);

document.body.appendChild(creatbtndiv);



var list = function () {
    var creatDiv = document.createElement("div");
    creatDiv.id = "submenudiv";
    creatDiv.className = "submenudiv";

    var creatul = document.createElement("ul");
    for(i = 0; i < 5; ++i){
        li = document.createElement("li");
        li.innerHTML = "Submenu" + i;
        creatul.appendChild(li);
    }

    creatDiv.appendChild(creatul);
    document.body.appendChild(creatDiv);
};



creatbtndiv.onclick = function () {
    var alert = confirm("yes master");
    list();
};

【讨论】：

【解决方案2】：

这是一个正确的小提琴，您的代码中有一些错误。 http://jsfiddle.net/8LZKc/

li = doument.createElement("li"); <-- should be document

index 没有定义，你想要i

name 不是元素，你想要creatDiv 在那里

【讨论】：

【解决方案3】：

for(i = 0; i < 5; i++){
li = document.createElement("li");
li.innerHTML = "Submenu" + i; <----------- Replace index with "i"
creatul.appendChild(li);
}

creatDiv.appendChild(creatul);

document.body.appendChild(creatDiv); <----------- Replace "name" with "createDiv"

【讨论】：

【解决方案4】：

文档在列表项循环中拼写错误。索引不在任何地方使用，切换到使用'i'的索引器。名称参数未使用或未提供值，但 creatDiv 是您为列表创建的目标元素。

var creatbtndiv = document.createElement("div");
var creatbtn = document.createElement("button");
creatbtn.innerHTML = "Click Me";

creatbtndiv.appendChild(creatbtn);

document.body.appendChild(creatbtndiv);

var list = function (name) {
    var creatDiv = document.createElement("div");
    creatDiv.id = "submenudiv";
    creatDiv.className = "submenudiv";

    var creatul = document.createElement("ul");
    for (i = 0; i < 5; ++i) {
        li = document.createElement("li");
        li.innerHTML = "Submenu" + i;
        creatul.appendChild(li);
    }

    creatDiv.appendChild(creatul);

    document.body.appendChild(creatDiv);
};



creatbtndiv.onclick = function () {
    var alert = confirm('yes master');
    list();
};

【讨论】：