jQuery自动完成将选择添加到div_Jquery_Jquery Autocomplete

jQuery自动完成将选择添加到div

jquery

jQuery自动完成将选择添加到div,jquery,jquery-autocomplete,Jquery,Jquery Autocomplete,我正在使用jQuery中的autocomplete插件，我想将结果的选择附加到一个div元素上，并添加其他元素：一个隐藏输入和一个文本输入这是我的html代码：这是我在jQuery中的函数： $("#buscar").autocomplete({ source: "procesos/buscarPersona.php", minLength: 2, select: function( event, ui ) { $("#acreditados")

我正在使用jQuery中的autocomplete插件，我想将结果的选择附加到一个div元素上，并添加其他元素：一个隐藏输入和一个文本输入

这是我的html代码：

这是我在jQuery中的函数：

$("#buscar").autocomplete({
    source: "procesos/buscarPersona.php",
    minLength: 2,
    select: function( event, ui ) {
        $("#acreditados")
            .append('<div class="col50"><p>'
            + '<input type="hidden" name="id" value="' + ui.item.id_persona + '"/>'
            + ui.item.value 
            + '</p></div>'
            + '<div class="col50 f-right"><p>Monto:' 
            + '<input type="text" /></p></div>');
        }
});

$（“#客车”）.autocomplete({
来源：“procesos/buscapersona.php”，
最小长度：2，
选择：功能（事件、用户界面）{
$（“Acredados”）
.append（“”
+ ''
+ui.item.value
+“”
+“Monto:”
+“”）；
}
});

到目前为止，我的代码运行良好，但是我发现很难维护显示选择结果和附加输入的append函数。有没有一种方法可以使用load（）函数使其更简单？最终输出必须附加多个选择，而不仅仅是最后一个选择。不要使用load，load是Ajax，这意味着与服务器通信。对于每个选择，除非您需要一些验证或更复杂的逻辑，否则我们应该避免网络访问

如果使用load，那么对于每个选择，您将与服务器通信，然后服务器将向您传递html

我觉得这个解决方案看起来很难看，但效率更高

编辑：

单独保存此分区：

    <div class="dynamiccontentcont">
       <div class="col50">
          <p><input type="hidden" name="id" value=""/></p>
       </div>
      <div class="col50 f-right">
         <p>Monto:<input type="text" /></p>
     </div>
   </div>



蒙托：

论选择

通过调用

jQuery（'.dynamicContent'）.Clone（）克隆此div

放置选定的值（正如您当前在代码中所做的那样）

在代码中附加div

不要使用load，load是Ajax，这意味着与服务器通信，对于每个选择，除非您需要一些验证或更复杂的逻辑，否则我们应该避免网络访问