javascript - 动态元素自动完成

我每次都为此而努力，今天又一次。
我要附加新的文本元素，我想将自动完成功能绑定到它。

此代码与以前的onClick一起使用

$('#highlights').before("<input type='text' id='check_name' name='name' placeholder='Name of OPM' required class='ui-autocomplete-input'>");

此自动完成功能位于网页的末尾

<script type="text/javascript">
$("#check_name").autocomplete({
      source: "src/check_name.php",
      minLength: 1
    });
</script>

通过URL访问PHP文件时，它运行良好。

最佳答案

因为.before()：在匹配的元素集中的每个元素之前插入由参数指定的内容。


您可以使用.prev()：

片段：

var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
  ];


  $('#highlights').before("<input type='text' id='check_name' name='name' placeholder='Name of OPM' required class='ui-autocomplete-input'>")
        .prev("#check_name")  // get the newly prev added ele
        .autocomplete({
            source: availableTags,
            minLength: 1
        });

<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>


<div id="highlights"></div>