0

我正在尝试使用 jquery 来推进一个自动完成的文本字段。

  • 用户输入 3 个字符
  • 城市被加载到下拉列表中（使用 ajax 自动完成）

现在我想：

  • 防止用户手动输入城市名称，而是从下拉列表中选择它。有没有好的方法来做到这一点？我已经搜索和搜索但没有找到一个好的解决方案，因为用户首先必须能够在文本字段中输入一些字符，才能触发自动完成。

到目前为止，我的函数可以正常工作（它现在只返回 city_name）：

  $("#user_profile_attributes_city_id").autocomplete({
    source: "/data/living",
    minLength: 1,
    select: function( event, ui ) {
      $(this).val(ui.item.label);
      $(this).find("#country_id").val(ui.item.country_id);
      $(this).find("#city_id").val(ui.item.city_id);
      event.preventDefault;
    }
  })
4

3 回答 3

1 
$('#element').bind('keyup', function() {
  if ($(this).val().length == 3) {
    $(this).prop('disabled', true);
    // ajax-call
  }
});​

jsFiddle

于 2012-07-08T11:00:25.560 回答
1

您最初可以放置自动完成功能，

 <input autocomplete="off" />

实际上，如果值在您想要的列表中，您应该对 FORM 提交进行一些验证。

 $('form#id').submit(function(){

//validate
if ($(this).val().length > 3) {
    return false;
}
if ( $(this).val()  is_in_list ) {
    return false;
}
});
于 2012-07-08T11:05:29.003 回答
1

您可以利用自动完成的“打开”和“关闭”事件来实现这一点。检查文档

于 2012-07-08T11:42:01.593 回答