我有一排從按鈕動態附加的輸入。第一個輸入連接到<datalist>由資料庫中的 php 填充的a 。當我從串列中單擊其中一個專案時,它會提取該特定專案的價格資訊,我需要它自動使用該價格填充下一個輸入。我可以alert("value.price");很好,但想不出一種方法來只選擇相應的<input>. 如果我使用.class,它將選擇所有具有該類的動態生成的輸入,并將所有專案的價格更改為該價格。顯然,我只希望那一行中的一個輸入改變。我可以通過使用洗掉腳本來做到這一點,closest但這不適用于<input>行內。
這是我的腳本:
$(document).ready(function() {
$('#new_line_btn').click(function() {
$('#pricing').append('<div class = "row"><div class = "col-sm input_col"><input name = "part_input[]" class ="form-control part_class" list = "part_list"></div>'
'<div class = "col-sm"><div class = "input-group"><span class = "input-group-text">$</span><input class = "form-control price_class" name = "price[]" onchange = "this.value = Number (this.value).toFixed(2)"></div>'
'</div><div class = "col-sm"><div class = "input-group"><input class = "form-control"><button class = "btn btn-light btn-outline-secondary delete">x</button></div></div></div>');
});
$('#pricing').on("change", ":focus", function() {
var value = $(this).val();
var part_id = $('#part_list [value="' value '"]').data('id');
$.ajax({
url: 'invoice_array.php',
method: 'POST',
data: {
part_id: part_id
},
dataType: 'JSON',
success: function(data) {
alert(value.price);
}
})
});
$("#pricing").on("click", ".delete", function() {
$(this).closest("div[class = 'row']").remove();
});
});
如您所見,我正在附加一行引導列和該行的洗掉按鈕。但是我如何只選擇class = "price_class"該特定行的輸入?
這:
<input class = "form-control price_class" name = "price[]" onchange = "this.value = Number (this.value).toFixed(2)">
是我需要價格出現的地方。
輸入不是直接的兄弟姐妹,我在類似主題上看到的唯一其他問題是關于.on()動態元素創建后的選擇,這不是我的問題。
在代碼片段中我有:
success: function(data){
alert(value.price);
}
但它應該更接近:
success: function(data){
$('.price_class').val(value.price);
}
我如何僅為該動態創建的行選擇價格輸入?謝謝
uj5u.com熱心網友回復:
似乎您可以以類似的方式訪問它,只需指定您要定位最后一個匹配的輸入。
$('#pricing').on("change", ":focus", function() {
let _this = $(this)
// ....
success: function(data) {
_this.closest('.row').find('input').last().val(data.price);
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/406145.html
標籤:
