我有以下脚本，只需点击一下按钮即可生成：
$('.pharmacy_service_payments').on('click', '.pharmacy_service_payment_link', function() {
//get
var visit_id = $(this).closest('li').find('input[name="visit_id_list"]').val();
var patient_id = $(this).closest('li').find('input[name="patient_id_list"]').val();
html1 = '';
htmlhead1 = '';
$.ajax({
type: "GET",
url: "<?php echo base_url(); ?>cashier/pharmacy_service_payments_details/" + visit_id + "/" + patient_id,
dataType: "JSON",
success: function(data) {
for (i = 0; i < data.length; i++) {
html1 += '<div>\n\
<div class = "form-group">\n\
\n\
<textarea required="" class = "form-control" style="width:100px" readonly="" name="description[]" id = "description" >' + data[i].description + '</textarea>\n\
</div>\n\
<div class = "form-group">\n\
\n\
<input type = "text" required="" class = "form-control" style="width:80px" readonly="" name="amount_charged[]" id = "amount_charged" value="' + data[i].amount_charged + '" placeholder = "Amount Charged">\n\
</div>\n\
<div class = "form-group">\n\
\n\
<input type = "text" required="" class = "form-control" name="amount_owed[]" readonly="" style="width:80px" id = "amount_owed" value="' + data[i].amount_owed + '" placeholder = "Amount Paid">\n\
</div>\n\
<div class = "form-group">\n\
\n\
<input type = "text" required="" class = "form-control amount_paid' + data[i].patient_visit_statement_id + '" name="amount_paid[]" style="width:80px" id = "amount_paid' + data[i].patient_visit_statement_id + '" placeholder = "Amount Paid">\n\
</div>\n\
<div class = "form-group">\n\
\n\
<input type = "text" required="" class = "form-control" style="width:80px" readonly="" name="quantity[]" id = "quantity" value="' + data[i].quantity + '" placeholder = "Quantity">\n\
<input type="hidden" required="" readonly="" name="patient_visit_statement_id[]" id="patient_visit_statement_id" value="' + data[i].patient_visit_statement_id + '">\n\
<input type="hidden" required="" readonly="" name="patient_id[]" id="patient_id" value="' + data[i].patient_id + '">\n\
<input type="hidden" required="" readonly="" name="visit_id[]" id="visit_id" value="' + data[i].visit_id + '">\n\
<input type="hidden" required="" readonly="" name="patient_payment_id[]" id="patient_payment_id" value="' + data[i].patient_payment_id + '">\n\
<input type="hidden" required="" readonly="" name="payment_prescription_tracker[]" id="payment_prescription_tracker" value="' + data[i].prescription_tracker + '">\n\<input type="hidden" required="" readonly="" name="amount_paid_td[]" id="amount_paid_td" value="' + data[i].amount_paid + '">\n\
\n\
\n\
</div>\n\
<div class = "form-group">\n\
\n\
\n\
<select required="" name="payment_method[]" class="" id="payment_method">\n\
<option value="' + data[i].payment_method + '">' + data[i].payment_method + '<option>\n\
<option value="Cash">Cash</option>\n\
<option value="M-Pesa">M-Pesa</option>\n\
<option value="Airtel Money">Airtel Money</option>\n\
<option value="Orange Money">Orange Money</option>\n\
<option value="PDQ">PDQ </option></select>\n\
</div>\n\
<div class = "form-group">\n\
\n\
<textarea type = "text" style="width:80px" required="" class = "form-control" name="payment_code[]" id = "payment_code" value="' + data[i].payment_code + '" placeholder = "Payment Code">' + data[i].payment_code + '</textarea>\n\
</div>\n\
</div>';
//Check if the amount paid is greater than the amount owed.
$("amount_paid" + data[i].patient_visit_statement_id).keyup(function() {
alert('Amount found');
var amount_paid = this.value;
var amount_owed = $("#" + this.id.replace("amount_paid", "amount_owed")).val();
});
}
htmlhead1 += '<div>\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "description">Description</label>\n\
</div>\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "amount_charged">Amount Charged</label>\n\
</div>\n\
\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "balance_remaining">Balance Remaining</label>\n\
</div>\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "amount_paid">Amount Paid</label>\n\
</div>\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "quantity">Quantity</label>\n\
</div>\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "payment_method">Payment Method </label>\n\
</div>\n\
<div class = "form-group">\n\
<label class = "label label-info" for = "payment_code">Payment Code </label>\n\
</div>\n\
</div>';
$('#patient_pharmacy_service_payment_div').empty();
$('#patient_pharmacy_service_payment_div').append(htmlhead1);
$('#patient_pharmacy_service_payment_div').append(html1);
},
error: function(data) {}
});
});
在脚本中我已经包含了一个keyup函数，它应该检查支付/键入的金额是否大于欠款金额并返回一个值。 但是当我运行脚本时，没有响应点击键。我尝试使用以下方法：Get a dynamic ID from am input field方法，但仍然失败，请建议......
答案 0 :(得分：0)
您正在将keyup事件绑定到尚未添加到DOM的元素。
（你的选择器也缺少'＃'......）
将绑定代码放在将生成的HTML添加到DOM的部分下面，或创建委派的事件处理程序：
$("#patient_pharmacy_service_payment_div").on("keyup", "#amount_paid" + data[i].patient_visit_statement_id, function () {
// fancy stuff...
});
答案 1 :(得分：0)
您添加的密钥启动事件仅在页面加载时存在DOM元素时才有帮助。 对于动态DOM元素，您应该使用 on 事件。确保使用的Jquery版本大于1.7.2。 您的密钥代码必须是
$(document).on("keyup", "#amount_paid" + data[i].patient_visit_statement_id, function () {
alert('Amount found');
var amount_paid = this.value;
var amount_owed = $("#" + this.id.replace("amount_paid", "amount_owed")).val();
});