Question

我目前正在为学校作业开发一个简单的网页，我想知道是否可以创建一个按钮，它会添加一个按钮，旁边还有一个按钮来删除按钮？

基本上是一个名为＆＃34;添加按钮＆＃34;的按钮。如果你点击它，一个大小相同的按钮（可以命名任何适当的，不需要任何功能）。无论我点击多少次，都会添加更多按钮，例如button1，button2，button3等。另外，在＆＃34;添加按钮＆＃34;旁边。按钮是一个名为＆＃34;删除按钮＆＃34;在那里它去除了按钮，例如从button3，button2，然后按钮1

Answer 1

您可以使用append（）jquery函数。这是一个例子：

df["Cost"] = df["Cost"].str[1:].astype(float)

Jquery：

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<button type="button" class="btn" id="add_button">add</button>
<button type="button" class="btn" id="delete_button">delete</button>
    <div class="result">

    </div>

Js fiddle：https://jsfiddle.net/p8y672oL/

Answer 2

这样的事情怎么样？稍微改变增量。

  <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
  <style>
   button{
     height:100px;
     width: 80px;
     text-align: center;
     margin: 5px 4px;
   }
  #mainButtons button{
    display: inline-block;
    margin: auto;
    }
   </style>


<div id="mainButtons">
 <button onclick="addButton()">Make Button</button>
 <button onclick="removeButton()">Remove Button</button>
</div>
</br>
<div id="que"></div>

<script>
var increment = 0;
function addButton(){
 $("#que").append($("<button id='btn"+(increment++)+"'>This is Button"+ (increment)+"</button>"));
}

function removeButton(){
  $("#btn"+(increment-1)).remove();
  increment--;
}
</script>

Answer 3

他们必须编号吗？如果没有，你可以附加按钮并使用jQuery的last（）和remove（）函数，而不需要增量/减量变量。

    <div class="button-test">
        <button type="button" id="add-button">Add Button</button>
        <button type="button" id="remove-button">Remove Last Button</button>
        <div id="new-buttons"></div>
    </div>


    <script>
        $('#add-button').on('click', function () {
            $('#new-buttons').append($('<button>', {
                'type': 'button',
                'class': 'temp',
                'text': 'new button'
            }));
        });

        $('#remove-button').on('click', function () {
            $('#new-buttons button.temp').last().remove();
        });
    </script>

添加和删除按钮

3 个答案:

添加和删​​除按钮

3 个答案:

添加和删除按钮