Question

我在输入上有一个自动完成功能，旁边是一个选择元素。当我在创建HTML列表$.autocomplete后触发<lu ..><li ..></li></lu>时，如果我选择了新选项，我就不希望它再次自动完成，直到我切换回来。

我可以使用$.remove删除该元素，但如果我再次触发自动完成事件，它就不会返回。我出于某种原因无法$.empty。

＆＃13;

var array = ['this', 'that', 'bla', 'potato'];

$('.input').on('keyup', function() {
  if ($('.option').val() === 'this') {
    $('.input').autocomplete({
      source: array
    });
  } else {
    // Something that removes/deactivates the autocomplete.
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class='options'>
  <option value='this'>DoAutocomplete</option>
  <option value='that'>DoNotAutocomplete</option>
<select>

<input class='input' />

＆＃13;

有没有人知道如何解决这个问题？

Answer 1

我认为这可能更容易在下拉列表中检测所选选项的值，并在您的问题上使用Taplars评论根据所选值启用或禁用自动完成功能。我没有尝试你的代码，但我认为'keyup'检测是问题的一部分。

以下是一个示例：JSFiddle

脚本：

$(document).ready(function() {
    var array = ['this', 'that', 'bla', 'potato'];

  $('#input').autocomplete({
            source: array
  });

  $('#select').on('change', function (e) {
        var selection = $("#select option:selected").val();

        if (selection == 'off') {
                $( "#input" ).autocomplete("disable");
        } else {
                $( "#input" ).autocomplete("enable");
        }
  });
});

HTML：

Toggle Autocomplete:
<select id='select'>
  <option value='on'>On</option>
  <option value='off'>Off</option>
</select><br><br>

<input id='input'>

$ .removed

1 个答案: