Question

jQuery新手在这里，我有一个包含2行的表，这些行中的输入元素设置为自动完成，这很有效。

我有一个'添加行'按钮，当点击时，jQuery会在表格上添加一个新行，这也很有效，但问题是自动完成功能不适用于附加元素，它们与元素相同以上工作完美。我在这里错过了什么吗？有没有办法绕过这里的问题？

代码如下。

jQuery

<script>
$(function() {

    $( ".id" ).autocomplete(
    {
         source: "autocomp.php?part=id"
    })

});

$(function() {

    $( ".internal" ).autocomplete(
    {
         source: "autocomp.php?part=internal"
    })

});

$(function() {

    $( ".title" ).autocomplete(
    {
         source: "autocomp.php?part=title"
    })

});

$(document).ready(function() {
$('a').click(function() {
   $('table').append('<tr><td><input name="id" class="id" type="text" /></td><td><input name="quantity" class="quantity" type="text" /></td><td><input name="internal" class="internal" type="text" /></td><td><input name="title" class="title" type="text" /></td><td>&pound;</td><td>&pound;</td></tr>');
});
});
</script>

和HTML

<table class="products" id="table" border="1" bordercolor="#000000" style="background-color:#FFFFFF; margin-left:5%; margin-top:40px;" width="90%" cellpadding="3" cellspacing="3">

    <tr>
        <td><b>ID</b></td>
        <td><b>Quantity</b></td>
        <td><b>Internal Name</b></td>
        <td><b>Title</b></td>
        <td><b>Unit Price</b></td>
        <td><b>Total</b></td>
    </tr>

    <tr>
        <td><input name="id" class="id" type="text" /></td>
        <td><input name="quantity" class="quantity" type="text" /></td>
        <td><input name="internal" class="internal" type="text" /></td>
        <td><input name="title" class="title" type="text" /></td>
        <td>&pound;</td>
        <td>&pound;</td>
    </tr>

    <tr>
        <td><input name="id" class="id" type="text" /></td>
        <td><input name="quantity" class="quantity" type="text" /></td>
        <td><input name="internal" class="internal" type="text" /></td>
        <td><input name="title" class="title" type="text" /></td>
        <td>&pound;</td>
        <td>&pound;</td>
    </tr>
            </table>

            <a href="javascript:void(0);">Add Line</a>

非常感谢您的帮助。

Answer 1

添加新的输入字段后，需要再次运行autocomplete()函数，因为它只在旧的输入元素上运行（加载页面时）并且没有在新的输入元素上运行

jQuery追加不支持自动完成的元素

1 个答案: