javascript中添加的按钮存在问题

problems with button added in javascript

本文关键字：存在 问题 按钮 添加 javascript      更新时间：2023-09-26

每次单击id为"button0"的按钮时，以下代码都会成功地将一个按钮添加到表单中。但是firebug给了我错误

form1 is null
[Break On This Error]   
form1.appendChild(element);

新按钮将不会执行函数"foo（）"，尽管它已经设置为其onclick值。这是代码

var counter = 0;
function add(){
  counter++;
  var element = document.createElement("input");
  element.type = "button";
  element.value = "test";
  element.name = "button"+counter;
  element.id = "button"+ counter;
  element.onclick="foo()";
  var form1 = document.getElementById("form1");
  var body1 = document.getElementById("b1");
  var header = document.getElementById("header");
  form1.appendChild(element);
  header.innerHTML = "Two Buttons";
};
function foo(){
  var butt =   document.getElementById("button1");
  butt.value = "works";
  console.log("works");
};
add();

如果我使用document.form1.appendChild（元素）；

有趣的是，我每次点击都会得到新按钮。只是按钮坏了。

这是我的html

<body id = "b1">
<script src = "button-in-code.js"></script>
<h1 id = "header">Buttons</h1>
<form id = "form1" name = "form1">
<input type="button" id = "button0" name="sel" value="Select all" onclick="add()">
</form>
<hr>
<address></address>
<!-- hhmts start -->Last modified: Mon Jul  8 10:07:26 EDT 2013 <!-- hhmts end -->
</body> </html>

尝试在带有<form>...</form>的html代码之后添加<script src = "button-in-code.js"></script>。

由于add();函数是自动执行的，因此必须在该函数中使用的html元素之后添加javascript代码。

相关文章：