gpt4 book ai didi

javascript - 如何在Javascript中动态制作按钮

转载 作者:行者123 更新时间:2023-11-28 14:49:36 25 4
gpt4 key购买 nike

我正在尝试用 javascript 制作一个动态按钮

    var button = document.createElement('input');
button.setAttribute('type', 'submit');
button.setAttribute('ID', 'btnSendMailClone');
button.setAttribute('value', 'Submit');
button.setAttribute('onclick', 'btnSendMail_Click()');
button.setAttribute('form', 'myform');
document.body.appendChild(button);
button.setAttribute("class", "btn btn-primary");
$('#button').addClass('myClass');
$('#btnSendMailClone').css("margin-right", "100px")
$('#btnSendMailClone').css("width", "98");

通过单击该事件,它应该出现在其单击事件上

function btnSendMail_Click() {
debugger;

}

按钮我调试它在这一行给我错误

document.body.appendChild(按钮);

它说无法获取属性附加子项。我是java脚本的新手。请指导我做错了什么

最佳答案

您的代码运行良好

var button = document.createElement('input');
button.setAttribute('type', 'submit');
button.setAttribute('ID', 'btnSendMailClone');
button.setAttribute('value', 'Submit');
button.setAttribute('onclick', 'btnSendMail_Click()');
button.setAttribute('form', 'myform');
document.body.appendChild(button);
button.setAttribute("class", "btn btn-primary");
$('#button').addClass('myClass');
$('#btnSendMailClone').css("margin-right", "100px")
$('#btnSendMailClone').css("width", "98");

function btnSendMail_Click() {
console.log("Submit !");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

可能的问题A

您正在使用 IE,那么您必须更换 IE

document.body.appendChild(button);

document.getElementsByTagName('body')[0].appendChild(button);

可能的问题B

您的脚本位于 <head> 内。这将在<body>之前执行脚本。已被浏览器看到。要解决此问题,请将脚本移到文档末尾

或者您可以使用$(document).ready(function(){...})

关于javascript - 如何在Javascript中动态制作按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45027943/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com