无法使用javascript在动态添加行中使用自动完成文本框

我创建了一个自动完成的文本框，当我们动态添加行时，它可以在正常的textboxbot中顺利工作，而自动完成的文本框无法工作

我的自动完成文本框的Javascript代码是

<script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript"
        src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
        <link rel="stylesheet" type="text/css"
        href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" />

        <script type="text/javascript">
                $(document).ready(function(){
                    $(".p").autocomplete({
                        source:'autocomplete1.php',
                        minLength:1
                    });
                });
        </script> 

我的动态添加行的Javascript代码是

<SCRIPT language="javascript">
        function addRow(tableID) {

            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);

            var colCount = table.rows[1].cells.length;

            for(var i=0; i<colCount; i++) {

                var newcell = row.insertCell(i);

                newcell.innerHTML = table.rows[1].cells[i].innerHTML;
                //alert(newcell.childNodes);
                switch(newcell.childNodes[0].type) {
                    case "text":
                            newcell.childNodes[0].value = "";
                            break;
                    case "checkbox":
                            newcell.childNodes[0].checked = false;
                            break;
                }
            }
        }

        function deleteRow(tableID) {
            try {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;

            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    if(rowCount <= 2) {
                        alert("Cannot delete all the rows.");
                        break;
                    }
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }


            }
            }catch(e) {
                alert(e);
            }
        }

    </SCRIPT>

<TD><INPUT type="checkbox" name="chk[]"/></TD>
          <td><input type="text" name="p[]" id="p" class="p" /></td>
          <td><input type="text" name="b[]" id="b" class="b" /></td>
          <td><input type="text" name="m[]" id="m"  class="m" /></td>
           <td><input type="text" name="qy[]" id="qy"/></td>
          <td><input type="text" name="dp[]" class="pr"/></td>
          <td><input type="text" name="q[]" class="q"/></td>

          <td><input name="txt[]" type="text" class="txt" id="txt" /></td>

我的动态添加行的HTML代码是

<SCRIPT language="javascript">
        function addRow(tableID) {

            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);

            var colCount = table.rows[1].cells.length;

            for(var i=0; i<colCount; i++) {

                var newcell = row.insertCell(i);

                newcell.innerHTML = table.rows[1].cells[i].innerHTML;
                //alert(newcell.childNodes);
                switch(newcell.childNodes[0].type) {
                    case "text":
                            newcell.childNodes[0].value = "";
                            break;
                    case "checkbox":
                            newcell.childNodes[0].checked = false;
                            break;
                }
            }
        }

        function deleteRow(tableID) {
            try {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;

            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    if(rowCount <= 2) {
                        alert("Cannot delete all the rows.");
                        break;
                    }
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }


            }
            }catch(e) {
                alert(e);
            }
        }

    </SCRIPT>

<TD><INPUT type="checkbox" name="chk[]"/></TD>
          <td><input type="text" name="p[]" id="p" class="p" /></td>
          <td><input type="text" name="b[]" id="b" class="b" /></td>
          <td><input type="text" name="m[]" id="m"  class="m" /></td>
           <td><input type="text" name="qy[]" id="qy"/></td>
          <td><input type="text" name="dp[]" class="pr"/></td>
          <td><input type="text" name="q[]" class="q"/></td>

          <td><input name="txt[]" type="text" class="txt" id="txt" /></td>

---

请帮助…

它不起作用，因为您只在$document.ready上应用了一次自动完成JQuery。 在动态添加行之后，还应该再次应用自动完成JQuery。像这样：

function addRow(tableID) {
    ...
    $(".p").autocomplete({
        source:'autocomplete1.php',
        minLength:1
    });
}

---

自动完成函数没有拾取动态创建的新元素，因为它是在调用该函数后创建的。因此，每次在函数addRow末尾添加行之后，您需要调用jQuery自动完成函数

function addRow(tableID) {
   //Your codes
    $(".p").autocomplete({
        source:'autocomplete1.php',
        minLength:1
    });
}