jsp—拼音检索中文

最新推荐文章于 2018-01-19 16:24:28 发布

gao2419956747

最新推荐文章于 2018-01-19 16:24:28 发布

阅读量473

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/gao2419956747/article/details/53168644

html 同时被 2 个专栏收录

2 篇文章

订阅专栏

jquery

1 篇文章

订阅专栏

本文介绍了如何在JSP项目中结合jQuery，实现前端的中文拼音检索功能。通过引用jQuery UI库，创建一个简单的自动补全输入框，从而提高用户的搜索体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先，先看一个最简单的检索。摘自 http://jqueryui.com/autocomplete/

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Autocomplete - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  } );
  </script>
</head>
<body>
 
<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>
 
 
</body>
</html>

这个方式只能实现，英文检索英文，中文检索中文。拼音还不能检索中文。

在检索资源不只可以使用对象，也可以使用方法。下面用方法实现拼音检索中文。

source:
 function( request, response ) {

          var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );

          response( $.grep( platformNames, function( item ){

              return matcher.test(Pinyin.GetQP(item).toLowerCase());

          }) );

      }

   });