Question

好的...感谢您的帮助，我设法解决了这些问题：

"autocomplete for dynamically created inputs"

和

"jQuery dinamically input fields not working"

尽管如此，当我尝试将整个事情混合起来时，（动态输入+自动完成）事情就是赢得了工作:(现在，......我不能让他们都没有工作。这里＆＃39;代码再一次......

<html>

<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" type="text/css" href="javascript/jquery.autocomplete.css" />
    <script type="text/javascript" src="javascript/jquery-2.1.0.min.js"></script>
    <script type='text/javascript' src='javascript/jquery.autocomplete.js'></script>
    <script type="text/javascript">
        // Funcion Autocomplete de jQuery para buscar los clientes y los productos en el input con clase "buscar" y clase "buscar_prod"
        $(document).ready(function() {
            $("#buscar").autocomplete("get_client_list.php", {
                width : 260,
                matchContains : true,
                selectFirst : false
            });
        });

        $(document).ready(function() {
            $(".buscar_prod").autocomplete("get_product_list.php", {
                width : 260,
                matchContains : true,
                selectFirst : false
            });
        });

        $(document).ready(function() {
            $('.multi-field-wrapper').each(function() {
                var $wrapper = $('.multi-fields', this);
                $(".add-field", $(this)).click(function(e) {
                    $('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();
                });
                $('.multi-field .remove-field', $wrapper).click(function() {
                    if ($('.multi-field', $wrapper).length > 1)
                        $(this).parent('.multi-field').remove();
                });
            });
        });

    </script>
    <title>AQUATAP - Gestor de Información - Añadir Pedido</title>
</head>

<body>

    <form role="form" action="add_order.php" method="POST">
        Cliente:
        <input type="text" name="cliente" id="buscar">
        <br>
        <hr />
        Fecha de salida:
        <br>
        <input type="radio" name="salida_pronosticada" value="male">
        En el día
        <br>
        <input type="radio" name="salida_pronosticada" value="male">
        2 días
        <br>
        <input type="radio" name="salida_pronosticada" value="female">
        3 días
        <br>
        <input type="radio" name="salida_pronosticada" value="female">
        5 días
        <br>
        <input type="radio" name="salida_pronosticada" value="female">
        1 semana
        <br>
        <input type="radio" name="salida_pronosticada" value="female">
        Otro
        <input type="text" name="salida_pronosticada_otro">
        días
        <br>
        <hr />
        <label>Stuff y cantidad</label>
        <div class="multi-field-wrapper">
            <div class="multi-fields">
                <div class="multi-field">
                    <input type="text" class="buscar_prod" name="input_referencia[]">
                    <input type="text" name="input_cantidad[]">
                    <button type="button" class="remove-field">
                        X
                    </button>
                </div>
            </div>
            <button type="button" class="add-field">
                Add field
            </button>
            <input type="submit" name="guardar" value="Guardar" />
        </div>
    </form>

</body>

再次......谢谢你的时间！

---- ---- EDITED

好的，我补充道在

之后$(".buscar_prod").autocomplete("get_product_list.php", {width : 260, matchContains : true, selectFirst : false});

$('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();

现在，自动完成适用于添加的每个动态输入，但它始终在第一个输入中同时触发。如果我关注第二，第三，第四，（等）输入，它不会介意，第一个也会出现焦点并触发自动完成（见下图）

multiple autocomplete

非常感谢任何帮助！谢谢！

Answer 1

请尝试以下更改

$（＆＃39; .multi-field：第一个孩子＆＃39;，$ wrapper）.clone（true）.appendTo（$ wrapper）.find（＆＃39;输入＆＃39;）VAL（＆＃39;＆＃39;。）聚焦（）;

在上面的行中，而不是将第一个孩子写为last-child并尝试...

$（＆＃39; .multi-field： last-child ＆＃39;，$ wrapper）.clone（true）.appendTo（$ wrapper）.find（＆＃39;输入＆＃39;）VAL（＆＃39;＆＃39;。）聚焦（）;

谢谢，

Bhimashankar ghathargi

jQuery动态输入字段+自动完成不能正常工作（总是在第一次输入时触发）

1 个答案: