使用jquery和javascript实现Hashtag客户端

输入{ -moz外观：textfield多行； -webkit外观：textarea； 边框：1px纯色灰色； 字体：中-moz固定； 字体：-webkit小控件； 高度：28px； 溢出：自动； 填充：2px； 调整大小：两者； 宽度：400px； }

---

听音乐我想这对你很有用

var inputData = "listening music #music #dance let's rock";
var arrayData = inputData.split(" ");

arrayData.forEach(function(entry) {
     if(entry.startsWith(("#music") || ("#etc"))){
     // hit your api
     }
});

您可以将keyup事件绑定到输入，以检查hashtag起始词。当找到匹配项时，调用AJAX。像这样：

var ajax;

$('#input').keyup(function() {

    var tags = $(this).val().split(' ');
    var lastTag = tags.pop();

    if (/#\S+\b/.test(lastTag)) {
        // abort previous ajax if still running
        if (ajax && ajax.abort && ajax.readyState !== 4)
            ajax.abort();

        // hit your search api
        ajax = $.getJson('/search', { q: lastTag })
               .done(function (data) {
                   // manage your response data here
                   // show suggestions and handle picking one
               });
    }
});

---

编辑：完全重做逻辑，更简单、更紧凑

那么问题出在哪里？如果你看到，我搜索了“m”，如果我选择了音乐，在文本框中的值像mmusic m+音乐，我想突出显示标签词。如果你看到推特，我需要像Tweet boxuser entered Listing music和user entered m一样的功能，mu或etc，一旦用户选择了任何建议，我希望m或mu或etc成为selectedItem，对我来说，它就像mselectedItem或museelecteditem，标签应该是不同的颜色或任何其他css。嗨rabelloo，谢谢你的回复，我已经尝试了您的代码，但ajax总是未定义，currentHashtagIndex的第一次值总是-1。你能重新检查你的脚本并更新它吗？是的，我错了，在写的时候重构了代码，把变量留在了keypress事件范围内。ajax总是未定义的，因为由于前面的错误，代码始终无法访问$.getJson。请尝试更新的代码。我刚刚意识到您不需要搜索变量，您可以使用currentHashtagIndex。更新代码以反映thatHi Rabelloo，谢谢，我也检查了更新代码，“index”和“query parameter”值不正确。你可以查看这个链接。我在这里更新了代码，忽略前面的注释链接。“索引”和“查询参数”值不正确。