Jquery 自动完成不适用于 class

Question

我正在使用 Jquery 的自动完成功能，当处理程序是一个 id 时，我一直在使用它，没有任何问题。但是，现在我需要相同的源变量来自动完成大量输入。我的想法是用 class 替换 id 但它不起作用（没有错误）。 jquery 是这样的：

<script>
$( function() {var all_users = [
        {
        id: "2",
        label: "Claudio"
        },
        {
        id: "3",
        label: "Tom"
        },
        {
        id: "4",
        label: "Brandon"
        },
        {
        id: "5",
        label: "Edgar"
        },
      {
        id: "0",
        label: "0"
      }
    ];

$( ".invitee" ).autocomplete({
  minLength: 0,
  source: all_users,
  focus: function( event, ui ) {
    $( ".invitee" ).val( ui.item.label );
    return false;
  },

  select: function( event, ui ) {
    $( "#invitee_name" ).val( ui.item.label );
    $( "#user_id" ).val( ui.item.id );
    return false;
     }
    })
  } );
  </script>

和 html:

<label>Who was your best friend in Kindergarden</label> 
<input type="text" class="form-control" class="invitee" id="1">

<label>Who was your best friend in High School</label> 
<input type="text" class="form-control" class="invitee" id="2">

<label>Who was your best friend in jail</label> 
<input type="text" class="form-control" class="invitee" id="3">

<input type="text" class="form-control" id="invitee_name">
<input type="text" class="form-control" id="user_id">

如果我将其中一个输入更改为 id="invitee" 并修复处理程序，它会运行良好，但仅适用于一个输入。我怎样才能解决这个问题而不需要不知疲倦地复制 '$( ".invitee" ).autocomplete'?

出于测试目的：avhub.teameivi.com/test_autocomplete.php

Answer 1

您错误地将 class 名称分配给了 <input> 元素。应该是

<input type="text" class="form-control invitee" id="1">

Jquery 自动完成不适用于 class

Jquery autocomplete does not work with class

jquery

autocomplete

jquery-ui-autocomplete