如何做'@somename'比如twitter功能

How to do '@somename' like twitter functionality?

本文关键字:比如 twitter 功能 何做 #39@somename      更新时间:2024-06-13

我正在尝试实现类似Twitter上的功能。如果我在文本框中写@J,则会出现一个列表,显示自动完成的起始名称"Javascript"、"Java"、"JQuery"。

当我选择Jquery时,它应该显示在TextBox中。我从Jquery获得了自动完成代码。但我无法执行此"@"功能。

以下是我迄今为止所做的代码:

<html lang="en">
    <head>
        <meta charset="utf-8">
            <title>autocomplete demo</title>
            <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">  
                <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
                <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>  

            </head>
            <body> 
                <label for="autocomplete">Select a programming language: </label>
                <input id="autocomplete"> 
                    <script>
var tags = [ "Javascript", "Jquery", "Java" ];
document.getElementById('autocomplete').onkeypress = function (e) {
        if (e.keyCode === 64 ) {        
            $( "#autocomplete" ).autocomplete({
  source: function( request, response ) {
          var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
          response( $.grep( tags, function( item ){
              return matcher.test( item );
          }) );
      }
});
                }
        else
        {
            return false;
        }
    };

                    </script> 
                </body>
            </html>

试试这个:

http://jsfiddle.net/gtnf41co/5/

它检查输入值以@:开头

if (this.value.search("@") == 0)

然后取出请求项中的@

request.term.replace("@", "") 

您可以通过在标签中添加@符号来使用自动完成功能:

<script>
var tags = [ "@Javascript", "@Jquery", "@Java" ];
$( "#autocomplete" ).autocomplete({
  source: tags      
});
</script>