Javascript autocomplete无法处理动态创建的输入字段jQuery

Javascript autocomplete无法处理动态创建的输入字段jQuery,javascript,php,jquery,Javascript,Php,Jquery,我在动态创建字段的自动完成中面临问题 正如附件中的图片一样,我通过点击加号创建了动态字段,第一行的autocomplete正在工作,而其余动态生成的autocomplete则不工作。 代码用于自动完成 $(".account_code").dropdown({ onChange: function (val) { var id=val; var dataString = 'id='+ id +'&type=account_code';

我在动态创建字段的自动完成中面临问题

正如附件中的图片一样,我通过点击加号创建了动态字段,第一行的autocomplete正在工作,而其余动态生成的autocomplete则不工作。 代码用于自动完成

  $(".account_code").dropdown({
      onChange: function (val) {
        var id=val;
        var dataString = 'id='+ id +'&type=account_code';
        alert(dataString);
        $.ajax
          ({
            type: "POST",
            url: "include/ajax_data.php",
            data: dataString,
            dataType: 'json',
            cache: false,
            success: function(data)
              {
                console.log(data);
                $("#account_description").val(data.value);
              } 
          });
      }
  });
动态行插入代码为

 function add_row()
  {
   $rowno=$("#bank_payment_voucher tr").length;
   $rowno=$rowno+1;
   $("#bank_payment_voucher tr:last").after('<tr id="row'+$rowno+'"><td><div class="field"><select class="ui search dropdown account_code" id="account_code'+$rowno+'" name="account_code[]"><option value="">Select Code</option><?php foreach (get_lookups($data_code) as $key => $value){ ?><option value="<?php echo $value['code']; ?>"><?php echo $value['code']." | ".$value['description']; ?></option><?php } ?></select></div></td><td><div class="field"><input type="text" name="account_description[]" id="account_description'+$rowno+'" placeholder="Account Description" autocomplete="" value="" required=""></div></td><td><div class="required field"><input type="text" name="remarks[]" id="remarks'+$rowno+'" placeholder="Remarks" autocomplete="off" value="" required=""></div></td><td><div class="required field"><input type="text" name="cheque_number[]" id="cheque_number'+$rowno+'" placeholder="Cheque Number" autocomplete="off" value="" required=""></div></td><td><div class="field"><div class="ui fluid action input"><input type="number" name="amount[]" id="amount'+$rowno+'" placeholder="Amount" autocomplete="off" value=""><div class="ui green icon button"><i class="pk flag"></i> PKR</div></div></div></td><td><div class="field"><div class="ui fluid action input"><i class="minus circle icon red" onclick=delete_row("row'+$rowno+'") style="font-size: 2.5em; cursor: pointer;"></i></div></div></td></tr>');
  }
控制台也没有显示任何错误

要求是:在每个动态行上,都有一个固定的下拉列表,根据从下拉列表中选择的值,表单的其余字段将自动填充

运行此操作时,请在此帮助我:

 $(".account_code").dropdown({
    ... 
});
您将在DOM中找到所有带有类account_代码的元素,并为它们指定一个行为,一个事件,当使用下拉功能时将触发该事件

该代码可能首先运行。 因此,当您为同一个类添加更多元素时,它们从未获得该行为的赋值

因此,在add_row函数中,您需要做的不仅仅是创建元素并附加它,还需要附加要在下拉列表中运行的事件

您可以使用此方法重新分配行为:

或者,您也可以将第一个代码段赋值行为封装到函数中,以便在每次添加新的动态元素时再次触发它

希望这有帮助。

看看这是否有用

$document.readyfunction{ var max_fields=10;//允许的最大输入框数 var wrapper=$.input\u fields\u wrapp;//fields wrapper var add\u button=$.add\u字段\u button;//添加按钮ID var x=1;//初始文本框计数 var可用属性=[ 账户地址, 账户地址城市, 账户、地址、国家、, 账户、地址、州、, 账户地址街道1, 账户地址街道2, 账户地址邮政编码, 帐户和电子邮件, 帐户登录, 账户名称, 账号, 客户电话 ]; $add_按钮。单击函数{//在添加输入按钮上单击 e、 防止违约; ifx我只是通过以下代码实现的

$(document).ready(function(){

 $(document).on('keydown', '.account_code', function() {

  var id = this.id;
  var splitid = id.split('_');
  var index = splitid[1];

  // Initialize jQuery UI autocomplete
  $( '#'+id ).autocomplete({
   source: function( request, response ) {

    $.ajax({
     url: "include/ajax_data.php",
     type: 'POST',
     dataType: "json",
     cache: false,
     data: {search: request.term,request:1},
     success: function( data ) {
      //console.log(data);
      response( data );
     }
    });
   },
   select: function (event, ui) {

    $(this).val(ui.item.code); // display the selected text
    var bank_code_id = ui.item.id; // selected value
    //console.log(bank_code_id);
    // AJAX
    $.ajax({
     url: 'include/ajax_data.php',
     type: 'post',
     cache: false,
     data: {bank_code_id:bank_code_id,request:2},
     dataType: 'json',
     success:function(response){

      var len = response.length;

      if(len > 0){

       var id = response[0]['id'];
       var description = response[0]['description'];
       // Set value to textboxes
       document.getElementById('lookupcodeid_'+index).value = id;
       document.getElementById('accountdescription_'+index).value = description;

      }

     }
    });

    return false;
   }
  });
  });
});

用作$.parent\u static\u div\u class.find'.account\u code'。下拉列表{…亲爱的devsi,我试过了,但没有成功:-你在使用Bootstrap JS下拉列表吗?显示你在哪里添加了。account_代码类在HTML@UmairMehmoodno中我在使用sementic UI,关于你在hi中询问的类,你能给我一个小例子吗?所以你需要在add_行函数中做的不仅仅是创建元素和附录下载它,但也附加您想要在下拉列表上运行的事件。因为我对jquery了解不多。谢谢