javascript - 自动完成动态输入字段失败

Question

这是创建描述字段的 div，第一个字段具有自动完成功能，但另一个问题是我可以动态添加字段，但添加的字段没有自动完成 jquery。

<div id="itemRows" class="form-group">
            <label class="col-sm-3 control-label">Immediate Cause</label>
            <div class="col-sm-7 btn-group" >
            <button onclick="addRow(this.form);" class="btn btn-default dropdown-toggle" style="float:right;" type="button" /><span class="glyphicon glyphicon-plus"></span></button>
            <input id="description" type="text" class="form-control" style="margin-bottom:15px; width: 553px;padding: 6px 12px;font-size: 14px;line-height: 1.42857143;color: #000;background-color: #fff;background-image: none;border: 1px solid #ccc;border-radius: 4px;" name="array_causes" placeholder="Immediate Cause">
            <input type="hidden" name="ranks" value="1">
            <?php echo form_error('immediate_cause'); ?>
            </div>
         </div>

                    <?php endif; ?>
            <?php if (!empty($result)){
                 $get_cause_Data = array();
                  foreach ($result as $row_data) {
                    $get_cause_Data[] = $row_data->icd.','.$row_data->description;
                  } 
                  $raw_data = implode('","',$get_cause_Data);
              }



            ?>
        <script>
        var dropdown = [
            "<?php echo $raw_data; ?>"
        ];
        var rowNum = 0;
        var rank = 1;
        function addRow(frm) {
        rowNum ++;
        rank ++;
        var row = '<div class="form-group" style="margin-left:-6px;" id="rowNum'+rowNum+'"><label class="col-sm-3 control-label">Another Cause</label><div class="col-sm-7 btn-group" ><input type="hidden" name="rank[]" value="'+rank+'"><button type="button" class="btn btn-default dropdown-toggle" style="float:right; margin-right:11px;" onclick="removeRow('+rowNum+');"><span class="glyphicon glyphicon-remove"></span></button><input id="description'+rank+'" type="text" class="form-control" style="width: 553px;padding: 6px 12px;font-size: 14px;line-height: 1.42857143;color: #000;background-color: #fff;background-image: none;border: 1px solid #ccc;border-radius: 4px;" name="array_cause[]" value="'+frm.array_causes.value+'" placeholder="Add another Cause"></div></div>';
        jQuery('#itemRows').append(row);
        frm.array_cause.value = '';
        $("#description"+rank).autocomplete({
          source: dropdown
        });
        }

        function removeRow(rnum) {
        jQuery('#rowNum'+rnum).remove();
        }

        $("#description").autocomplete({
          source: dropdown
        });
    </script>

Answer 1

你为什么不试试这样的实时功能

  $("input:text[id^='txtTags']").live("focus.autocomplete", null, function () {
        $(this).autocomplete({
            source: availableTags,
            minLength: 0,
            delay: 0
        });

        $(this).autocomplete("search");
    });

您还可以找到此演示:http://jsfiddle.net/6mtYe/

live 只是一个例子，最好使用 jQuery 版本推荐的 live 函数。