我有一个 PHP 代码,其中使用 HTML 代码,所有这些看起来都类似于下一个代码片段:
<?php
$receiverNumber = 1;
$senderNumber = 1;
?>
<head>
<script src="./index.js"></script>
</head>
<form method="post" action="">
<div id="senders">
<div>
Sender 0
<input placeholder="Sender ID" name="sender-0"/>
<button name="addSender">+</button>
</div>
</div>
<div id="receivers">
<div>
Receiver 0
<input placeholder="Receiver Wallet ID" name="receiver-0"/>
<input placeholder="Received Sum" name="received-0"/>
<button onClick="addNewElement('receivers', <?php $receiverNumber ?>, 'R')">+</button>
</div>
</div>
</form>
我想要做的是通过单击+
按钮来触发一个函数,该函数将在div中添加一个新元素。这是我正在使用的 JS 代码:
function newSender(ID){
return (`<div>
Sender ${ID}
<input placeholder="Sender ID" name="sender-${ID}"/>
</div>`);
};
function newReceiver(ID){
return (`<div>
Receiver ${ID}
<input placeholder="Receiver Wallet ID" name="sender-${ID}"/>
<input placeholder="Received Sum" name="received-${ID}"/>
</div>`);
};
function addNewElement(id, idNum, purpose){
switch(purpose){
case 'R' : fragment = newReceiver(idNum); break;
case 'S' : fragment = newSender(idNum); break;
default: break;
};
element = document.getElementById(id);
element.insertBefore(fragment, element.firstChild);
}
并且,当我按下分配了该功能的按钮时,页面只是刷新并且不显示任何内容,这段代码有什么问题?
最佳答案
尝试appendChild()
方法。
此外,您还缺少 type="button"
HTML 中的元素。
更改此:<button name="addSender">+</button>
对此:<type="button" button name="addSender">+</button>
关于javascript - 从 HTML 添加新元素到 div 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51850630/