Question

下面我有代码，我试图使用Javascript动态创建一个按钮（我不想只用HTML创建一个按钮）当我在本地运行网页时，没有按钮出现。

buttonActionFunction是一个单独的函数（完全正常），单击按钮时会出现一个图像。

此外，如何添加该代码，以便在单击按钮后按钮停用，以便他们无法再次单击该按钮？

<script>
    function buttonFunction() {
        var button= document.createElement("button");
        button.appendChild(document.createTextNode("Click Me"));
        button.onclick=buttonActionFunction();
        document.getElementById("divId").appendChild(button);
    }
    buttonFunction();
    </script>

Answer 1

 function createButton(context, func) {
     var button = document.createElement("input");
     button.type = "button";
     button.value = "Click Me";
     button.onclick = func;
     context.appendChild(button);
 }
 function functienaam()
 {
     createButton(document.body, functienaam);
 }
 createButton(document.body, functienaam);

jsfiddle：https://jsfiddle.net/fv42orad/1/

Answer 2

将<div id="divId"></div>添加到您的HTML

关于点击

时禁用按钮

   function buttonActionFunction(e) {
        e.target.disabled = true
    }

和button.onclick=buttonActionFunction;没有 button.onclick=buttonActionFunction();

Answer 3

基于@lordKain回答我已更新代码，以便在点击时禁用上一个按钮，如下所示：

function createButton(context){
    var button = document.createElement("input");
    button.type = "button";
    button.value = "Click Me";
    button.onclick = function() {functienaam(button)};
    context.appendChild(button);
}
 function functienaam(button)
 {
 createButton(document.body);
 button.disabled = true;
 }
createButton(document.body);

https://jsfiddle.net/5unLc5xr/

如何使用JavaScript动态显示按钮？

3 个答案: