我在按鈕單擊時在 div 標簽內創建 div，它已創建并顯示在 UI 上，但我無法獲得插入動態創建的 div 的唯一值。我總是得到第一個值。代碼示例：
<div id="row-list-outer"> </div>
動態添加代碼示例，此代碼在每次點擊時運行
$("#row-list-outer").append(` <div class="row g-3">
<div>
<input type="text" id="salesPersonName" placeholder="Name">
</div>
</div>)
現在輸入元素是在點擊時創建的，但是如果我在第二行輸入或第三行輸入等中輸入一個值。那么我如何以與插入它們相同的順序獲取這些值。例如，如果用戶在第一行輸入中輸入，那么它應該存盤在陣列中的索引 0 上，同樣，如果用戶在第 1 行、第 2 行輸入，那么它應該分別插入到索引 1、2 的陣列中
uj5u.com熱心網友回復：
你可以嘗試這樣的事情：
function addRow() {
$("#row-list-outer").append(`<div >
<div>
<input type="text" id="salesPersonName${$("input[id^=salesPersonName]").length 1}" placeholder="Name">
</div>
</div>`)
}
$(document).on("change","input[id^=salesPersonName]",function() {
var v = $("input[id^=salesPersonName]").map(function() {
return $(this).val() || ""
}).get();
console.log(v)
})
演示
顯示代碼片段
function addRow() {
$("#row-list-outer").append(`<div >
<div>
<input type="text" id="salesPersonName${$("input[id^=salesPersonName]").length 1}" placeholder="Name">
</div>
</div>`)
}
$(document).on("change","input[id^=salesPersonName]",function() {
var v = $("input[id^=salesPersonName]").map(function() {
return $(this).val() || ""
}).get();
console.log(v)
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="row-list-outer"> </div>
<button onclick="addRow()">addRow</button>uj5u.com熱心網友回復：
您可以嘗試以下代碼： HTML：
<div id="row-list-outer"> </div>
<button>Change color</button>
查詢：
$("button").click(function(e){
e.preventDefault();
$("#row-list-outer").append(` <div >
<div>
<input type="text"
data-id="${$('.salesPersonName').length 1}" placeholder="Name">
</div>
</div>`);
})
let colors = [];
$(document).on("change","input",function(e){
let i = $(this).data('id') - 1
colors[i] = $(this).val();
console.log(colors)
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/527226.html
上一篇：如何創建帶有字典串列的嵌套字典