首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >jQuery autocomplete @jQuery

jQuery autocomplete @jQuery
EN

Stack Overflow用户
提问于 2012-04-08 05:06:31
回答 2查看 9.5K关注 0票数 2

我有一个来自Andrew 演示的自动完成插件,假设我在一个textarea中有一个字符串。

@peterwateber欢迎

我希望它在隐藏标记中输出,如

@peterwateber欢迎

我怎么发动汽车呢?我不太擅长Javascript..。

我试着看了一下来自鹰派的代码这里

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2012-04-08 19:46:48

我编写了这里提到的原始代码,并修复了Peter遇到的菜单问题:

http://www.hawkee.com/snippet/9391/

票数 3
EN

Stack Overflow用户

发布于 2012-04-08 05:40:36

你好,工作演示这里:http://jsfiddle.net/67dxH/

就像你说的,上面已经有了很好的讨论,行为就像:value of the hidden tag as = @[C#] and the textarea as @C#

这是个乐于助人的人,让我知道进展如何,干杯!)

Jquery代码

代码语言:javascript
运行
复制
function split(val) {
    return val.split(/@\s*/);
}

function extractLast(term) {
    return split(term).pop();
}

function getTags(term, callback) {
    $.ajax({
        url: "http://api.stackoverflow.com/1.1/tags",
        data: {
            filter: term,
            pagesize: 5
        },
        type: "POST",
        success: callback,
        jsonp: "jsonp",
        dataType: "jsonp"
    });    
}

$(document).ready(function() {

    $("#tags")
    // don't navigate away from the field on tab when selecting an item
    .bind("keydown", function(event) {
        if (event.keyCode === $.ui.keyCode.TAB && $(this).data("autocomplete").menu.active) {

            event.preventDefault();
        }
    }).autocomplete({
        source: function(request, response) {
            if (request.term.indexOf("@") >= 0) {
                $("#loading").show();
                getTags(extractLast(request.term), function(data) {
                    response($.map(data.tags, function(el) {
                        return {
                            value: el.name,
                            count: el.count
                        }
                    }));
                    $("#loading").hide();                    
                });
            }
        },
        focus: function() {
            // prevent value inserted on focus
            return false;
        },
        select: function(event, ui) {
            var terms = split(this.value);
            // remove the current input
            terms.pop();
            // add the selected item
            ui.item.value = "@" + ui.item.value;   
            terms.push(ui.item.value);
            // add placeholder to get the comma-and-space at the end
            terms.push("");
            this.value = terms.join("");
            return false;
        }
    }).data("autocomplete")._renderItem = function(ul, item) {
        return $("<li>")
            .data("item.autocomplete", item)
            .append("<a>@[" + item.label + "]&nbsp;<span class='count'>(" + item.count + ")</span></a>")
            .appendTo(ul);
    };
});​
票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/10060536

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档