Question

我有一个包含单行（textfield）和添加行按钮的表，当用户单击Add row时，它会动态创建包含文本字段的另一行。此外，我在该文本字段上应用自动完成。现在自动完成功能正确地在第一行工作，但是当我添加新行时它不起作用。下面是我的代码plz告诉我哪里错了

添加行功能

function addRow(tableID) {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
            var colCount = table.rows[0].cells.length;
            for(var i=0; i<colCount; i++) {
                var newcell = row.insertCell(i);
                newcell.innerHTML = table.rows[0].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;
                    case "select-one":
                            newcell.childNodes[0].selectedIndex = 0;
                            break;
                }

            }

        }

jQuery自动完成功能

$(function() {
        var availableTags = [
            "Apple",
            "Dell",
            "Microsoft",
            "Sony",

        ];
        $( "#product" ).autocomplete({
            source: availableTags
        });
    });

添加包含文字字段的行按钮和表格

<input type="image" src="../images/add.png" onClick="addRow('dataTable')" />
<TABLE id="dataTable" width="350px" border="1">
 <TR>
   <TD> <INPUT type="text" name="product" id="product" /> </TD>
 </TR>
</TABLE>

Answer 1

基本上，这里发生的事情是你动态创建的新元素没有被jQuery自动完成功能选中，因为它是在你调用该函数后创建的。所以你需要做的是每次添加行之后调用jQuery自动完成函数（在函数addRow（）的末尾）。

使用jQuery自动完成动态添加行

1 个答案: