已解決430363個問題，去搜搜看，總會有你想問的

在一個 div 中添加多個元素，而其他元素不會丟失它們的值

首頁猿問在一個 div...

在一個 div 中添加多個元素，而其他元素不會丟失它們的值

JavaScript

墨色風雨 2021-12-23 16:14:42

當我使用添加按鈕添加一個輸入時，更改其值，然后添加另一個輸入，容器中已經存在的輸入將失去它們的值。let btn = document.getElementById('addBtn');let container = document.getElementById('container');btn.onclick = function() { container.innerHTML += `<input type="number" max="10" min="1" value="1"><br>`;}<button id="addBtn">add element</button><div id="container"></div>

查看完整描述

2 回答

DIEA

TA貢獻1820條經驗獲得超3個贊

使用insertAdacentHTML代替+=ing 到innerHTML容器的。這樣，現有元素就不會被破壞：

let btn = document.getElementById('addBtn');

let container = document.getElementById('container');

btn.onclick = function() {

container.insertAdjacentHTML('beforeend', `<input type="number" max="10" min="1" value="1"><br>`);

};

<button id="addBtn">add element</button>

innerHTML在 HTML 中讀取時，更改容器的將有效清除元素字符串中不存在的任何內容。因此， set.value不會被保留，事件偵聽器也不會。

insertAdjacentHTML，另一方面，不會重新解析任何現有的子項 -它只插入相鄰的 HTML，其他所有內容都單獨存在。

您還可以使用createElement和附加來創建元素appendChild，但是當有很多屬性時，這有點冗長。

反對回復 2021-12-23

慕森王

TA貢獻1777條經驗獲得超3個贊

$(document).ready(function(){

var add='<input type="text" value="hello" readonly />';

$('#btn2').click(function(){

$('p').append(add);

});

</script>

反對回復 2021-12-23

2 回答
0 關注
193 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

在一個 div 中添加多個元素，而其他元素不會丟失它們的值

在一個 div 中添加多個元素，而其他元素不會丟失它們的值

2 回答

添加回答

在一個 div 中添加多個元素，而其他元素不會丟失它們的值