Question

我正在使用jQuery UI Autocomplete。当值很长时，我想在输入框中输入子串文本。

例如

var availableTags = [ "value long long long long", "value" ];

$( ".chooseGiftWrapper input#tags" ).autocomplete({
    source: availableTags,
    minLength: 0,
    open: function(event, ui) {
        $('.ui-menu').width(200).css({'position':'static','top': '0'});
        $('#chooseGiftWrapperHead .listFriends').show().addClass('open');
        nameFriendPosition();
         $('.listFriendsWrapper.scroll').jScrollPane({autoReinitialise: true});
    },
    select: function(event, ui) {

        $('#chooseGiftWrapperHead .chooseGiftcloseBtn').addClass('active');
        $('.dropDownBlock.listFriends').hide().removeClass('open');

    },
    focus: function(event, ui) {
        var default_value = $(this).attr('default_value');
        if ($(this).val() == default_value) {
            $(this).val('');
            $(this).removeClass('set_default');
            $('#chooseGiftWrapperHead .chooseGiftcloseBtn').removeClass('active');
        } 


    },
    change: function(event, ui) {

    }
})
.data("autocomplete")._renderItem = function (ul, item) {
    return $("<li />")
        .data("item.autocomplete", item)
        .append("<a><img src='img/testAvatar.png'><p class='nameFriend'>" + item.label + "</p></a>")                                
        .appendTo(ul);
}

但是选择事件对我不起作用。

Answer 1

我找到了问题的解决方案

select: function(event, ui) {
            name = ui.item.value;
            lengthName = name.length;
            substrName = '';
            if( lengthName > 23){
                ui.item.value = name.substr(0,23) + '...';
            } else {
                ui.item.value = name;
            }
            $(this).val(ui.item.value);


            $('#chooseGiftWrapperHead .chooseGiftcloseBtn').addClass('active');
            $('.dropDownBlock.listFriends').hide().removeClass('open');

        },

jQuery UI自动完成输入值子字符串

1 个答案: