Question

我是新来的，我有一个问题：

html代码：

<div class="col-lg-4"><input type="text" id="eenheid" class="form-control autocomplete-field" name="eenheid" autocomplete="off" placeholder="Eenheid..."></div><div class="col-lg-4"><input type="text" id="ingredient" class="form-control autocomplete-field" name="ingredient" autocomplete="off" placeholder="Ingredient...">

jQuery代码

$( document ).ready(function() {
//autocomplete
var autocomplete_field_id = $('.autocomplete-field').attr('id');

$(".autocomplete-field").on('input', function() {
    autocomplete_field_id = this.id;
});

$( "#" + autocomplete_field_id ).autocomplete({
    source: "autocomplete.php?field=" + autocomplete_field_id,
    minLength: 2
 });
});

我尝试对多个输入字段使用相同的代码，当输入字段处于活动状态时，自动完成功能中的jQuery选择器应该从活动输入字段更改为id。

使用我目前使用的代码，选择器（id）始终保持不变。

提前致谢

Answer 1

如果我清楚地了解您，您希望选择器autocomplete_field_id的值为活动输入字段的ID。

您应该使用on('input')。

，而不是使用on('focus')

您可以这样编写代码：

$( document ).ready(function() {
    //autocomplete
    var autocomplete_field_id;

    $(".autocomplete-field").on('focus', function() {
        autocomplete_field_id = this.id;
    });

    $( "#" + autocomplete_field_id ).autocomplete({
        source: "autocomplete.php?field=" + autocomplete_field_id,
        minLength: 2
    });
});

希望这有帮助。

Answer 2

如果你想要的是为每个输入添加相同的自动完成，你可以使用jQuery的.each -

//autocomplete
$(".autocomplete-field").each(function(index, me) {
  // me referrs to the current item with class "autocomplete-field"
  $(me).autocomplete({
    source: "autocomplete.php?field=" + autocomplete_field_id,
    minLength: 2
  });
});

.each将遍历与选择器匹配的每个元素并运行提供的函数（在这种情况下，您将添加自动完成）。参数代表 -

所选集合中项目的索引（“索引”）
项目本身（“我”）

jQuery - 自动完成：对多个输入字段使用相同的代码

2 个答案: