1

我试图弄清楚如何使用按钮来创建显示在所选按钮前面的新按钮。有三个按钮和一个“插入”按钮。我希望能够单击按钮 1，然后插入并在其前面出现一个新按钮。按钮 2 和 3 也会发生同样的情况。

我注意到通过我的代码单击按钮会自动在表格的单元格 0 处创建一个新按钮。我不希望按钮实际执行任何操作，而是接受“插入”按钮可以使用的用户输入将它们放置在那里。

请帮忙，我卡住了。

我到目前为止的代码是：

<html>
<head>
<title>Button Sequence Creation</title>
<script>
function displayResult()
{
var firstRow=document.getElementById("myTable").rows[0];
var x=firstRow.insertCell();
x.innerHTML="New"
}
</script>
</head>
<body>
<h1>Button Sequence Creation</h1>
<hr>
<table id = "myTable" border="1">
  <tr>
        <td>
    <input type="button" value="button1" name ="button1" onclick="displayResult()"></td>
        <td>
    <input type="button" value="button2" name ="button2" onclick="displayResult()"></td>
        <td>
    <input type="button" value="button3" name ="button3" onclick="displayResult()"></td>
  </tr>
</table>
<br>
<button type="button" onclick="displayResult()">Insert</button>
</body>
</html>
4

1 回答 1

2

不确定您希望“插入”按钮如何工作。但是下面的代码有效。

<html>
<head>
  <title>Button Sequence Creation</title>
  <script>
    function displayResult(obj){
      var firstRow=document.getElementById("myTable").rows[0];
      var newButton = document.createElement('input');
      newButton.type = 'button';
      newButton.value = "New";

      var newTD = document.createElement('td');
      newTD.appendChild(newButton);

      obj.parentNode.parentNode.insertBefore(newTD, obj.parentNode);
    }
  </script>
</head>
<body>
  <h1>Button Sequence Creation</h1>
  <hr>
    <table id = "myTable" border="1">
      <tr>
        <td>
          <input type="button" value="button1" id="button1" name ="button1" onclick="displayResult(this)">
        </td>
        <td>
          <input type="button" value="button2" id="button2" name ="button2" onclick="displayResult(this)">
        </td>
        <td>
          <input type="button" value="button3" id="button3" name ="button3" onclick="displayResult(this)">
        </td>
      </tr>
   </table>
   <br>
   <!--button type="button" onclick="displayResult()">Insert</button-->
</body>
</html>
于 2013-02-22T23:01:57.213 回答