【问题标题】:JQuery autocomplete list disappearJQuery 自动完成列表消失
【发布时间】:2013-11-27 08:28:36
【问题描述】:

当我尝试在我的自动完成列表中选择一个元素时,整个列表就会消失!一旦我尝试在下拉列表中移动鼠标,就会发生这种情况。

我的自动完成:

包含js/jquery-ui-1.10.3.custom.min.js,与jquery-ui-1.10.3.custom.less相同。

有什么想法吗?

HTML 代码:

<div id="region_box" name="region_box">
<input type="text" name="name" placeholder="<%$(language.placeholder.search_box.%b__lang)%>" id="yourCity" size="35" maxlength="50" style="width:340px;" tabindex="1">
<input id="chooseb_auto" class="choose" value="&translate("SEARCHBOX_CHOOSE_BUTTON")" type="submit">
<div class="error_label">

...

JS代码:

// Choose the city button 
var both = 0;
$(".choose").live("click",function(){
    for (var id in regionArray) {
        if( trim(regionArray[id].name[lang]).toUpperCase() == trim($("#yourCity").val()).toUpperCase() ) {
            otherRegionChoosen(id);
            window.LightBox.close();
            return;
        }
    }
..

PS:我在网站的其他页面上也有相同的自动完成功能,并且可以正常工作,但在登录页面上却没有

【问题讨论】:

  • 请发布您的 HTML 和 JS 代码。
  • 不显示您的代码,不可能有人会指出问题。正如您在此处看到的那样,它确实有效jsfiddle.net/DLLVw
  • @AamirAfridi 对不起,我只是发布它
  • @RoryMcCrossan 完成!对不起

标签: jquery css autocomplete triggers jquery-autocomplete


【解决方案1】:

如果你使用的是最新的 jquery 版本,你必须非常清楚

.data("autocomplete")._renderItem = function (ul, item) { }; 在这一行。

这里我们会犯的错误是“autocomplete”.....在JQuery更高版本我们必须

give like .data("ui-autocomplete")._renderItem = function (ul, item) {};

我给你分享一些sn-p....请找到它,如果你有任何问题,请随时问我..快乐编码!!!!!!

我想你明白我在说什么.....

$('#ID_YourElement').autocomplete({ 来源:函数(请求,响应){

                var URL = '';

                URL = "yourServiceURL";


                $.ajax({
                    url: URL,
                    dataType: "json",
                    success: function (data2) {
                        response($.map(data2, function (item) {
                            return {
                                label: item.FirstName + ' ' + item.LastName,
                                value: item.FirstName + ' ' + item.LastName,
                                Data: item
                            }
                        }));


                    }
                });
            },
            minLength: 2,
            select: function (event, ui) {

                $(this).attr("Data", JSON.stringify(ui.item.Data));

                uiResult.push(ui.item.Data);


            },
             open: function (event, ui) {
                if ($('.ui-autocomplete').find('li').length > 3) {
                    $('.ui-autocomplete').css('padding-right', '20px').css('width', '340px').css('max-height', '225px').css('overflow-y', 'auto').addClass('dropdown-menu');
                }
                else {
                    $('.ui-autocomplete').css('padding-right', '2px').css('width', '340px').css('max-height', '225px').css('overflow-y', 'auto').addClass('dropdown-menu');
                }
                $(".ui-helper-hidden-accessible").hide();
                $(this).autocomplete('widget').css('z-index', 100000);

                return false;
            }
        }).data("ui-autocomplete")._renderItem = function (ul, item) {

            var html = '';

            html = html + '<a href="javascript:;" tabindex="-1">';

            html = html + '<div style="font-weight: 600;" class="span10">';
            html = html + '<span>' + item.FirstName + ' ' + item.LastName + '</span><br>';
            html = html + '<span>' + item.Email + '</span>';
            html = html + '</div>';

            html = html + '</a>';



            return $("<li></li>").data("item.autocomplete", item).append(html).appendTo(ul);
        };

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-07-11
    • 2011-06-19
    • 2017-01-23
    • 1970-01-01
    • 2012-03-10
    • 1970-01-01
    相关资源
    最近更新 更多