Jquery在动态创建的输入上自动完成

Question

我还在学习javascript 和Jquery。我正在使用 jQuery 创建简单的autocomplete：

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>	
	  
<script>
  $(function() {
    $( "#nazov" ).autocomplete({
		minLength: 2,
		source: 'private/search.php',
	
	select: function(event, ui) {
    document.getElementById("pocet").value = ui.item.pocet;

  }	
    });
	
	
  });

  <label for="nazov">Názov: </label>
  <input id="nazov">
  <input id="pocet">

我有一些基本的 JS 函数来创建输入。每个新输入都有 id="nazov" 但自动完成仅适用于非动态输入，并且每个动态创建的新输入都不起作用。

我认为这是因为自动完成功能不知道新输入。有什么方法可以将自动完成更改为寻找新的输入并自动完成每个具有不同返回的输入？我发现了一些不推荐使用的函数 .live() 和 .on() 但我想我不能在这里使用它，或者我不知道如何使用。

感谢您的帮助。

祝你有美好的一天！

Answer 1

由于 ID 是唯一的，因此您不应重复分配一个 ID。为此使用一个类。所以你的代码看起来像这样：

JS：

$(function() {
    $(".nazov").autocomplete({
    minLength: 2,
    source: 'private/search.php',

    select: function(event, ui) {
        document.getElementByClass("pocet").value = ui.item.pocet;
    }
  });
});

HTML：

<label for="nazov">Názov: </label>
<input class="nazov">
<input class="pocet">

希望对你有帮助