Javascript Jquery从动态字段获取动态类名

我有一个点击按钮生成的脚本：

 $('.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) {}
   });

 });

$（'.pharmacy\u service\u payments'）。在（'单击'，'.pharmacy\u service\u payment\u link'，函数（）上{
//得到
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({
键入：“获取”，
url:“出纳/药房服务付款详情/”+就诊id+“/”+患者id，
数据类型：“JSON”，
成功：功能（数据）{
对于（i=0；i

在脚本中，我包含了一个keyup函数，该函数用于检查支付/键入的金额是否大于所欠金额，并返回一个值。

---

但是，当我运行脚本时，单击向上键时没有响应。我尝试使用以下方法：但仍然失败，请告知…

您正在将keyup事件绑定到尚未添加到DOM的元素

（您的选择器也缺少“#”…）

将绑定代码放在将生成的HTML添加到DOM的部分下面，或者创建委托事件处理程序：

$("#patient_pharmacy_service_payment_div").on("keyup", "#amount_paid" + data[i].patient_visit_statement_id, function () {
    // fancy stuff...
});

---

只有在页面加载时存在DOM元素时，您添加的key up事件才有帮助。 对于动态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();
                });

---

这是您添加的大量代码。我建议你组织起来，只展示相关的东西。