清除失去焦点的字段,除非该字段是从下拉菜单中填充的

JQuery- clear field on lost focus unless the field was populated from dropdown

本文关键字:字段 下拉菜单 填充 失去 焦点 清除      更新时间:2023-09-26

我有一个文本框,用户在其中输入一些文本,并出现一个下拉框。当用户从下拉列表中选择内容时,下拉列表中的文本将替换用户键入的文本。

现在,我想让这个文本框自己清除如果他们没有从下拉菜单中选择任何东西。

基本上,唯一可以出现在文本框中的文本是最终从下拉菜单中选择的。我该如何做到这一点?

我试过:

  jQuery("#" + field).focusout(function() {
    jQuery("#" + field).val("");
  });

但这仍然清除,即使他们从下拉菜单中选择。我要实现什么逻辑来做到这一点?我能不能设置一个变量或者别的什么当它们从列表中选择时被设置为true。然后我会检查这个对焦函数?

JQuery新手!

使用autocomplete change事件,检查是否存在ui(从菜单中选择的项目,如果有的话)。否则属性为null),如果它不存在,那么你知道用户没有选择autocomplete选项,你可以清空值:

change: function (ev, ui) {
    if (!ui.item) {
        $(this).val('');
    }
}

这里有一个简单的demo

可能是这样的:

jQuery("#" + field).focusout(function() {
    var enteredValue = $("#" + field).val();
    var listOfAvailableOptions = //put method call here
    if($inArray(enteredValue, listOfAvailableOptions)) //possibly use IndexOf() here and check if = -1
{
    jQuery("#" + field).val("");
}
});
更简洁的方法是通过
从AJAX调用填充组合框的值。