JQuery Auto Complete заменяет Select Drop Down - PullRequest
Новая
       4

JQuery Auto Complete заменяет Select Drop Down

0 голосов
/ 09 декабря 2011

Я использую виджет автозаполнения jQuery для ввода текста, чтобы заменить выпадающий список выбора. Раскрывающийся список подсказок открывается, когда пользователь щелкает текстовое поле. Мое решение отлично работает в FireFox, но работает с небольшим затруднением в Internet Explorer 8. В Internet Explorer, когда элемент выбран из выпадающего списка подсказок, список подсказок исчезает, а затем вновь появляется на короткую секунду. Я понятия не имею, как это предотвратить.

Я использую: (jquery) jquery-1.6.4.min.js (пользовательский интерфейс jquery) jquery-ui-1.8.16.custom.min.js

Код ниже 

<input type="text" style="width:200px;" id="txtPosTypeS" value="" />

var RegTempList = [
{ label: "Auxiliary Monthly Trust", value: 1000},
{ label: "Auxiliary Monthly Operating", value: 1001},
{ label: "Auxiliary Hourly Trust", value: 1002},
{ label: "Auxiliary Hourly Operating", value: 1003}]

 $().ready(function() {
    $('#txtPosTypeS').autocomplete({
        minLength: 0,
        source: RegTempList,
        delay: 0,
        focus: function( event, ui ) {
            $(this).val( ui.item.label );
            return false;
        },
        select: function( event, ui ) {
            $(this).blur();
            $(this).val( ui.item.label );
            return false;
        },
        change: function (event, ui) {
            //if the value of the textbox does not match a suggestion, clear its value
            if ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0) {
                $(this).val('');
                $('#hidPositionType').val('');
            }
        },
        close: function(event, ui) {
            $(this).blur();
            return false;
        }
    })
    .focus(function(){
        $(this).autocomplete('search','');
    })
    .data( "autocomplete" )._renderItem = function( ul, item ) {
        return $( "<li></li>" )
            .data( "item.autocomplete", item )
            .append( "<a>" + item.label + "</a>" )
            .appendTo( ul );
    }; });

1 Ответ

1 голос
/ 09 декабря 2011

При использовании IE8 и jsfiddle в textEquals в функции изменения возникает ошибка сценария. Удаление функции изменения устраняет проблему.

Просто скинул это в jsFiddle, вот ссылка.

http://jsfiddle.net/BDd9H/

Кроме того, обновлена ​​ширина текстового поля, чтобы текст не перепрыгивал.

...