как сделать автозаполнение пустым после выбора элемента из выпадающего списка

0

Вот мой код:

    var availableTags = ["Afghanistan","Albania","Algeria","Andorra","Angola","Antigua and  Barbuda","Argentina","Armenia","Australia","Austria","Azerbaijan","Bahrain","Bangladesh","Barbados","Belarus","Belize","Benin","Bhutan","Bolivia","Bosnia and Herzegovina","Botswana","Brazil","Brunei","Bulgaria","Burkina Faso","Burundi","Cambodia","Cameroon","Canada","Cape Verde","Central African Republic","Chad","Chile","China","Columbia","Comoros","Congo","Costa Rica","Croatia","Cuba","Cyprus","Czech Republic","Czechoslovakia","Dem. Rep. of Congo","Denmark","Djibouti","Dominica","Dominican Republic","Ecuador","Egypt","El Salvador","Equatorial Guinea","Eritrea","Estonia","Ethiopia","Finland","Finland","France","France","Gabon","Gambia, The","Georgia","Germany","Ghana","Greece","Grenada","Guadeloupe (Fr.)","Guam","Guatemala","Guinea","Guinea-Bissau","Guyana","Haiti","Honduras","Hungary","Iceland","India","Indonesia","Iran","Iraq","Ireland","Isreal","Italy","Ivory Coast","Jamaica","Japan","Jordan","Kazakhstan","Kenya","Korea, North","Korea, South","Kuwait","Kyryzstan","Laos","Latvia","Lebanon","Leichtenstein","Lesotho","Liberia","Libya","Lithuania","Luxembourg","Macedonia","Madagascar","Malawi","Malaysia","Maldives","Mali","Malta","Martinique (Fr.)","Mauritania","Maurtitus","Mexico","Moldova","Monaco","Mongolia","Morocco","Mozambique","Myanmar (Burma)","Namibia","Nepal","Netherlands","New Zealand","Nicaragua","Niger","Norway","Oman","Pakistan","Panama","Paraguay","Peru","Philippines","Poland","Portugal","Puerto Rico","Qatar","Romania","Russia","Rwanda","San Marino","San Marino","Sao Tome and Principe","Saudi Arabia","Senegal","Serbia and Montenegro","Seychelles","Sierra Leone","Singapore","Slovakia","Solvenia","Somalia","South Africa","South Korea","Spain","Sri Lanka","St. Kitts-Nevis","St. Lucia","St. Vincent and the Grenadines","Sudan","Suriname","Swaziland","Sweden","Switzerland","Syria","Tajikistan","Tanzania","Tasmania","Thailand","Timor, East","Togo","Trinidad and Tobago","Tunisia","Turkey","Turkmenistan","Uganda","Ukraine","United Kingdom","Unites Arab Emirates","Uruguay","USA","Uzbekistan","Vatican City","Venezuela","Vietnam","Virgin Islands (U.K.)","Virgin Islands (U.S.)","Yemen","Zambia","Zimbabwe"];
    var country;
    $( "#country_name" ).autocomplete({
      source: availableTags,
      autoFocus: true,
      select: function( event, ui ) {              
           country=ui.item.value;
           $('#div_selected_country').text($('#div_selected_country').html()+"\n"+country);
           $('#hid_country_names').val($('#div_selected_country').html());
           //$('#country_name').val()="";//doesn't become blank.
      }
    });

  });

и вот мой html файл

<input name="hid_country_names" id="hid_country_names" type="hidden">
<div id="div_selected_country" style="float:left; width:25%">

когда я начинаю писать название страны, он показывает мне список сопоставленных стран в раскрывающемся списке. после выбора страны она появится в текстовом поле. но я хотел, чтобы название страны должно появиться в моей div_selected_country (отлично работает) и сделать текстовое поле country_name пустым.

Теги:

3 ответа

1

Вызов метода val() в поле ввода без параметров возвращает значение. Ваше выражение

$('#country_name').val()="";

То же самое, что сказать

some_string = "";

Вы хотите установить его в пустую строку в параметре

$('#country_name').val(''); 

Событие может быть установлено снова. Это должно сделать трюк

$( "#country_name" ).autocomplete({
  source: availableTags,
  autoFocus: true,
  select: function( event, ui ) {              
       country=ui.item.value;
       $('#div_selected_country').text($('#div_selected_country').html()+"\n"+country);
       $('#hid_country_names').val($('#div_selected_country').html());
       $(this).val('');
       return false;
  }
});

Используя $ (this), поскольку контекст является элементом ui. Возврат false из метода должен предотвратить повторную настройку автозаполнения.

Этот ответ предлагает то же самое и объясняет, почему: Очистить поле формы после выбора для автозавершения пользовательского интерфейса jQuery, вы должны, вероятно, просто пойти на голосование, ответ.

  • 0
    Я пытался, но текстовое поле все еще не становится пустым.
  • 0
    Пожалуйста, включите HTML-код для ввода, который вы хотите сделать пустым. Возможно, ваш селектор неверен.
Показать ещё 3 комментария
0

Поскольку вы написали строку ниже

$('#hid_country_names').val($('#div_selected_country').html());

вы должны знать, что это должно быть

$('#country_name').val('');

Или попробуйте

  $('#country_name').text('');
  • 0
    Я пытался, но результат тот же. Текстовое поле country_name не становится пустым.
  • 0
    вы пробовали $ ('# country_name'). text ('');
0
    select: function (event, ui) {
        event.preventDefault();
        country=ui.item.value;
        $('#div_selected_country').text($('#div_selected_country').html()+"\n"+country);
        $('#hid_country_names').val($('#div_selected_country').html());
        if ( ui.item ){
          $('#country_name').attr('value', '');

        }
    }
  • 0
    отредактировано, чтобы добавить оператор protectDefault.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню