用java等語(yǔ)言仿360首頁(yè)拼音輸入全模糊搜索和自動(dòng)換膚
360首頁(yè)搜索效果如下
1、完成編寫(xiě)的schoolnet校園網(wǎng)主要目錄結(jié)構(gòu)如下
主要實(shí)現(xiàn)支持中文、拼音首字母、拼音全字母的智能搜索和換膚
頁(yè)面效果如下
主要核心代碼如下
1、head.jsp
<%@page import="java.io.File"%> <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>校園網(wǎng)首頁(yè)面</title> <link rel="stylesheet" href="/schoolnet/css/index.css" type="text/css" /> <script type="text/javascript" src="/schoolnet/js/ddsmoothmenu.js"></script> <script src="/schoolnet/js/jquery.js"></script> <script src="/schoolnet/js/jquery-ui.js"></script> <script type="text/javascript" src="/schoolnet/js/publicJs.js"></script> <script type="text/javascript" src="/schoolnet/myAJAX/ajax_uni.js"></script> <script type="text/javascript" src="/schoolnet/js/style.js"></script> <c:if test="${loginuser.skin.id!=null }"> <script type="text/javascript"> $(document).ready( function setskin() { var photo = '${loginuser.skin.photo}'; $("body").css( "background", "#f6f6f6 url(/schoolnet/images/pf/" + photo + ") top repeat"); }); </script> </c:if> </head> <body> <div class="topsearch"> <div class="topsearchtype" id="searchtype"> <a class="current" href="javascript:void(0)" onclick="setsearchtype(this),setsearch()" name="searchdatas" id="books.png">資料</a> <a href="javascript:void(0)" onclick="setsearchtype(this),setsearch()" name="searchsongs" id="t01d566d0c28b32ddad.png">音樂(lè)</a> <a href="javascript:void(0)" onclick="setsearchtype(this),setsearch()" name="searchnews" id="newspaper.png">新聞</a> <a href="javascript:void(0)" onclick="setsearchtype(this),setsearch()" name="searchxiaoshuos" id="library.png">小說(shuō)</a> <a href="javascript:void(0)" onclick="setsearchtype(this),setsearch()" name="searcharticles" id="blog.gif">日志</a> </div> <form id="search-form" action="/schoolnet/other.do?flag=searchdatas&searchpageNow=1" method="post" name="searchdatas" target="blank" onsubmit="return checksearch()"> <img src="/schoolnet/images/front/books.png" id="searchimg" width="32px" height="32px" style="margin-bottom:-10px" /><input type="text" class="topsearchtext" name="search" id="topsearchtext" onkeyup="setsearch()" onfocus="newsearch()" "/> <input id="inputsearchtype" type="submit" class="topsearchbutton" value="搜索資料" /> </form> <ul id="setsearch" class="setsearch"> </ul> </div> <div id="MainMenu" class="ddsmoothmenu"> <ul> <li><a href="/schoolnet/login.do?flag=goHomeUI" title="" id="*menu_selected"><span>校園網(wǎng)</span> </a> </li> <li><a href="/schoolnet/login.do?flag=goHomeUI" title=""><span>個(gè)人中心</span> </a></li> <li><a href="/schoolnet/profile.do?flag=goHomePageUI" title=""><span>我的主頁(yè)</span> </a></li> <li><a href="javascript:void(0)" title=""><span>應(yīng)用</span> </a> <ul class="menulevel"> <li><a href="/schoolnet/shou.do?flag=ShuoShuo&pageNow=1" title="">說(shuō)說(shuō)</a> </li> <li><a href="/schoolnet/album.do?flag=myAlbumUI&pageNow=1&userid=${loginuser.id }" title="">相冊(cè)</a> </li> <li><a href="/schoolnet/friend.do?flag=myfriendUI&pageNow=1" title="">好友</a> </li> <li><a href="/schoolnet/article.do?flag=articleUI&pageNow=1&userid=${loginuser.id }" title="">日志</a> </li> <li><a href="/schoolnet/music.do?flag=goMusicHome&pageNow=1" title="">音樂(lè)</a> </li> <li><a href="/schoolnet/news.do?flag=gonewsUI&typeid=1&pageNow=1" title="">新聞</a> </li> <li><a href="/schoolnet/datas.do?flag=godatasUI&pageNow=1&action=all" title="">資料</a> </li> <li><a href="/schoolnet/xiaoshuo.do?flag=goxiaoshuoUI&pageNow=1&id=all" title="">小說(shuō)</a> </li> <li><a href="/schoolnet/skin.do?flag=goskinUI&pageNow=1&id=all" title="">裝扮</a> </li> <li><a href="/schoolnet/share .do?flag=goShareUI&pageNow=1" title="">新鮮事</a> </li> </ul> </li> <li><a href="javascript:void(0)" title=""><span>關(guān)于</span> </a> <ul class="menulevel"> <li><a href="/schoolnet/other.do?flag=goAboutUI#1" title="">關(guān)于我們</a> </li> <li><a href="/schoolnet/other.do?flag=goAboutUI#2" title="">網(wǎng)站地圖</a> </li> <li><a href="/schoolnet/other.do?flag=goAboutUI#3" title="">版權(quán)說(shuō)明</a> </li> <li><a href="/schoolnet/other.do?flag=goAboutUI#4" title="">友情鏈接</a> </li> </ul> </li> <li><a href="javascript:void(0)" title=""><span>設(shè)置</span> </a> <ul class="menulevel"> <li><a href="/schoolnet/register.do?flag=updUI">修改個(gè)人信息</a> </li> <li><a href="/schoolnet/login.do?flag=logout">退出</a> </li> </ul> </li> </ul> <c:if test="${loginuser!=null }"> <div id="page-wrap"> <ul class="dropdown"> <li id="menu_selected"><a id="menu_selected" href="/schoolnet/login.do?flag=goHomeUI"> <img src="/schoolnet/images/head/${loginuser.photo}" width="120px" height="45px" style=" margin-top:-18px;margin-left:-10px" /> </a> <ul class="sub_menu"> <li><a href="/schoolnet/register.do?flag=updUI">修改個(gè)人信息</a> </li> <li><a href="/schoolnet/login.do?flag=logout">退出</a> </li> </ul></li> </ul> </div> </c:if> </div> </body> </html>
2、主要js函數(shù)
//用于設(shè)置切換搜索類(lèi)型,觸發(fā)input控件焦點(diǎn)時(shí)顯示對(duì)應(yīng)的熱門(mén)(前五個(gè))內(nèi)容(資料、音樂(lè)、新聞、小說(shuō)、日志) function setsearchtype(o){ $("#searchtype a").removeClass("current"); $(o).addClass("current"); var inputsearchtype=$(o).text(); $("#inputsearchtype").val("搜索"+inputsearchtype); document.getElementById("search-form").action="/schoolnet/other.do?flag="+o.name+"&searchpageNow=1"; document.getElementById("search-form").name=o.name; document.getElementById("searchimg").src="/schoolnet/images/front/"+o.id; $("#topsearchtext").show(); $("#searchfriendss").hide(); if(o.name=="searchfriends") { $("#topsearchtext").hide(); $("#searchfriendss").show(); } } //用于設(shè)置顯示智能提示的內(nèi)容(模糊搜索時(shí)匹配的前十個(gè)) function setsearch() { var v=document.getElementById("topsearchtext").value; var type=document.getElementById("search-form").name; if(v.length==0) { $("#setsearch").html(""); } if(v.length>0) { $.ajax({ cache: true, type: "POST", url : "/schoolnet/ChangeInfo", data: {"action":"setsearch","search":v,"searchtype":type}, async: false, dataType: "html", success: function(data) { $("#setsearch").html(""); $("#setsearch").append(data); } }); }; }
主要java文件
if("searchsongs".equals(searchtype)) <span style="white-space:pre"> </span>{ <span style="white-space:pre"> </span>String nameHEAD[]=ChinesePinYinTool.getHeadByString(search); <span style="white-space:pre"> </span>String nameHeadString=""; <span style="white-space:pre"> </span>for (int i = 0; i < nameHEAD.length; i++) { <span style="white-space:pre"> </span>nameHeadString+=nameHEAD[i]; <span style="white-space:pre"> </span>} <span style="white-space:pre"> </span>String nameALL[]=ChinesePinYinTool.stringToPinyin(search); <span style="white-space:pre"> </span>String nameAllString=""; <span style="white-space:pre"> </span>for (int i = 0; i < nameALL.length; i++) { <span style="white-space:pre"> </span>nameAllString+=nameALL[i]; <span style="white-space:pre"> </span>} <span style="white-space:pre"> </span>List<Song> songs=universityService.executeQueryByPage("from Song where to_pinyin(name) like '%"+ nameAllString +"%' or pinyin(name) like '%"+ nameHeadString +"%'", null, 1, 10); <span style="white-space:pre"> </span>for(int i=0;i<songs.size();i++) <span style="white-space:pre"> </span>{ <span style="white-space:pre"> </span>con +="<li><a target='blank' href='/schoolnet/music.do?flag=goPatentDisplay&pid="+songs.get(i).getPatent().getId()+"'>"+songs.get(i).getName()+"</a></li>"; <span style="white-space:pre"> </span>} <span style="white-space:pre"> </span>if (songs.size()!=0) { <span style="white-space:pre"> </span>con +="<li><a href='javascript:void(0)' onclick='hideli()' style='display:inline;float:right;margin-right:8px;'>關(guān)閉</a></li>"; <span style="white-space:pre"> </span>} <span style="white-space:pre"> </span>else { <span style="white-space:pre"> </span>con +="<li><a href='javascript:void(0)' onclick='hideli()' style='display:inline;'>無(wú)任意匹配結(jié)果</a></li>"; <span style="white-space:pre"> </span>} <span style="white-space:pre"> </span>out.write(con); <span style="white-space:pre"> </span>out.close(); <span style="white-space:pre"> </span>} else if("setpifu".equals(action)) <span style="white-space:pre"> </span>{ <span style="white-space:pre"> </span>String skinid=request.getParameter("skinid"); <span style="white-space:pre"> </span>Skin skin=(Skin) universityService.findById(Skin.class, Integer.valueOf(skinid)); <span style="white-space:pre"> </span>Users user=(Users) request.getSession().getAttribute("loginuser"); <span style="white-space:pre"> </span>user.setSkin(skin); <span style="white-space:pre"> </span>universityService.update(user); <span style="white-space:pre"> </span>}
做拼音轉(zhuǎn)換時(shí)需導(dǎo)入pinyin4j.jar包
ChinesePinYinTool拼音轉(zhuǎn)換工具類(lèi)
package schoolnet.utils;
import net.sourceforge.pinyin4j.PinyinHelper; import net.sourceforge.pinyin4j.format.HanyuPinyinCaseType; import net.sourceforge.pinyin4j.format.HanyuPinyinOutputFormat; import net.sourceforge.pinyin4j.format.HanyuPinyinToneType; import net.sourceforge.pinyin4j.format.exception.BadHanyuPinyinOutputFormatCombination; /** * * 漢語(yǔ)拼音工具 * * * */ public class ChinesePinYinTool { public static void main(String[] args) { String string[]=stringToPinyin("這個(gè)"); for (int i = 0; i < string.length; i++) { System.out.println(string[i]); } } /** * * 將字符串轉(zhuǎn)換成拼音數(shù) * * * @param src * @return */ public static String[] stringToPinyin(String src) { return stringToPinyin(src, false, null); } /** * 將字符串轉(zhuǎn)換成拼音數(shù) * * * @param src * @return */ public static String[] stringToPinyin(String src, String separator) { return stringToPinyin(src, true, separator); } /** * 將字符串轉(zhuǎn)換成拼音數(shù) * * * @param src * @param isPolyphone * 是否查出多音字的拼音 * * @param separator * 多音字拼音之間的分隔 * * @return */ public static String[] stringToPinyin(String src, boolean isPolyphone, String separator) { // 判斷字符串是否為 if ("".equals(src) || null == src) { return null; } char[] srcChar = src.toCharArray(); int srcCount = srcChar.length; String[] srcStr = new String[srcCount]; for (int i = 0; i < srcCount; i++) { srcStr[i] = charToPinyin(srcChar[i], isPolyphone, separator); } return srcStr; } /** * 將單個(gè)字符轉(zhuǎn)換成拼音 * * @param src * @return */ public static String charToPinyin(char src, boolean isPolyphone, String separator) { // 創(chuàng)建漢語(yǔ)拼音處理 HanyuPinyinOutputFormat defaultFormat = new HanyuPinyinOutputFormat(); // 輸出設(shè)置,大小寫(xiě),音標(biāo)方 defaultFormat.setCaseType(HanyuPinyinCaseType.LOWERCASE); defaultFormat.setToneType(HanyuPinyinToneType.WITHOUT_TONE); StringBuffer tempPinying = new StringBuffer(); // 如果是中 if (src > 128) { try { // 轉(zhuǎn)換得出結(jié)果 String[] strs = PinyinHelper.toHanyuPinyinStringArray(src, defaultFormat); // 是否查出多音字,默認(rèn)是查出多音字的第字符 if (isPolyphone && null != separator) { for (int i = 0; i < strs.length; i++) { tempPinying.append(strs[i]); if (strs.length != (i + 1)) { // 多音字之間用特殊符號(hào)間隔起來(lái) tempPinying.append(separator); } } } else { tempPinying.append(strs[0]); } } catch (BadHanyuPinyinOutputFormatCombination e) { e.printStackTrace(); } } else { tempPinying.append(src); } return tempPinying.toString(); } public static String hanziToPinyin(String hanzi) { return hanziToPinyin(hanzi, ""); } /** * 將漢字轉(zhuǎn)換成拼音 * * @param hanzi * @param separator * @return */ @SuppressWarnings("deprecation") public static String hanziToPinyin(String hanzi, String separator) { // 創(chuàng)建漢語(yǔ)拼音處理 HanyuPinyinOutputFormat defaultFormat = new HanyuPinyinOutputFormat(); // 輸出設(shè)置,大小寫(xiě),音標(biāo)方 defaultFormat.setCaseType(HanyuPinyinCaseType.LOWERCASE); defaultFormat.setToneType(HanyuPinyinToneType.WITHOUT_TONE); String pinyingStr = ""; try { pinyingStr = PinyinHelper.toHanyuPinyinString(hanzi, defaultFormat, separator); } catch (BadHanyuPinyinOutputFormatCombination e) { e.printStackTrace(); } return pinyingStr; } /** * 將字符串?dāng)?shù)組轉(zhuǎn)換成字符串 * * @param str * @param separator * 各個(gè)字符串之間的分隔 * * @return */ public static String stringArrayToString(String[] str, String separator) { StringBuffer sb = new StringBuffer(); for (int i = 0; i < str.length; i++) { sb.append(str[i]); if (str.length != (i + 1)) { sb.append(separator); } } return sb.toString(); } /** * 的將各個(gè)字符數(shù)組之間連接起來(lái) * * * @param str * @return */ public static String stringArrayToString(String[] str) { return stringArrayToString(str, ""); } /** * 將字符數(shù)組轉(zhuǎn)換成字符 * * * @param str * @param separator * 各個(gè)字符串之間的分隔 * * @return */ public static String charArrayToString(char[] ch, String separator) { StringBuffer sb = new StringBuffer(); for (int i = 0; i < ch.length; i++) { sb.append(ch[i]); if (ch.length != (i + 1)) { sb.append(separator); } } return sb.toString(); } /** * 將字符數(shù)組轉(zhuǎn)換成字符 * * * @param str * @return */ public static String charArrayToString(char[] ch) { return charArrayToString(ch, " "); } /** * 取漢字的首字 * * * @param src * @param isCapital * 是否是大 * * @return */ public static char[] getHeadByChar(char src, boolean isCapital) { // 如果不是漢字直接返回 if (src <= 128) { return new char[] { src }; } // 獲取的拼 String[] pinyingStr = PinyinHelper.toHanyuPinyinStringArray(src); // 創(chuàng)建返回對(duì)象 int polyphoneSize = pinyingStr.length; char[] headChars = new char[polyphoneSize]; int i = 0; // 截取首字 for (String s : pinyingStr) { char headChar = s.charAt(0); // 首字母是否大寫(xiě),默認(rèn)是小 if (isCapital) { headChars[i] = Character.toUpperCase(headChar); } else { headChars[i] = headChar; } i++; } return headChars; } /** * 取漢字的首字默認(rèn)是大 * * @param src * @return */ public static char[] getHeadByChar(char src) { return getHeadByChar(src, true); } /** * 查找字符串首字母 * * @param src * @return */ public static String[] getHeadByString(String src) { return getHeadByString(src, true); } /** * 查找字符串首字母 * * @param src * @param isCapital * 是否大寫(xiě) * @return */ public static String[] getHeadByString(String src, boolean isCapital) { return getHeadByString(src, isCapital, null); } /** * 查找字符串首字母 * * @param src * @param isCapital * 是否大寫(xiě) * @param separator * 分隔 * * @return */ public static String[] getHeadByString(String src, boolean isCapital, String separator) { char[] chars = src.toCharArray(); String[] headString = new String[chars.length]; int i = 0; for (char ch : chars) { char[] chs = getHeadByChar(ch, isCapital); StringBuffer sb = new StringBuffer(); if (null != separator) { int j = 1; for (char ch1 : chs) { sb.append(ch1); if (j != chs.length) { sb.append(separator); } j++; } } else { sb.append(chs[0]); } headString[i] = sb.toString(); i++; } return headString; } }
數(shù)據(jù)庫(kù)建立相關(guān)函數(shù)
fristPinyin : 此函數(shù)是將一個(gè)中文字符串的第一個(gè)漢字轉(zhuǎn)成拼音首字母 (例如:"好的"->h)
pinyin :此函數(shù)是將一個(gè)中文字符串對(duì)應(yīng)拼音首字母的每個(gè)相連 (例如:"好的"->hd)
to_pinyin :此函數(shù)是將一個(gè)中文字符串對(duì)應(yīng)拼音全字母的每個(gè)相連 (例如:"好的"->haode)
CREATE FUNCTION `fristPinyin`(P_NAME VARCHAR(255)) RETURNS varchar(255) CHARSET utf8 BEGIN DECLARE V_RETURN VARCHAR(255); SET V_RETURN = ELT(INTERVAL(CONV(HEX(left(CONVERT(P_NAME USING gbk),1)),16,10), 0xB0A1,0xB0C5,0xB2C1,0xB4EE,0xB6EA,0xB7A2,0xB8C1,0xB9FE,0xBBF7, 0xBFA6,0xC0AC,0xC2E8,0xC4C3,0xC5B6,0xC5BE,0xC6DA,0xC8BB, 0xC8F6,0xCBFA,0xCDDA,0xCEF4,0xD1B9,0xD4D1), 'A','B','C','D','E','F','G','H','J','K','L','M','N','O','P','Q','R','S','T','W','X','Y','Z'); RETURN V_RETURN; END CREATE FUNCTION `pinyin`(P_NAME VARCHAR(255)) RETURNS varchar(255) CHARSET utf8 BEGIN DECLARE V_COMPARE VARCHAR(255); DECLARE V_RETURN VARCHAR(255); DECLARE I INT; SET I = 1; SET V_RETURN = ''; while I < LENGTH(P_NAME) do SET V_COMPARE = SUBSTR(P_NAME, I, 1); IF (V_COMPARE != '') THEN #SET V_RETURN = CONCAT(V_RETURN, ',', V_COMPARE); SET V_RETURN = CONCAT(V_RETURN, fristPinyin(V_COMPARE)); #SET V_RETURN = fristPinyin(V_COMPARE); END IF; SET I = I + 1; end while; IF (ISNULL(V_RETURN) or V_RETURN = '') THEN SET V_RETURN = P_NAME; END IF; RETURN V_RETURN; END CREATE FUNCTION to_pinyin(NAME VARCHAR(255) CHARSET gbk) RETURNS VARCHAR(255) CHARSET gbk BEGIN DECLARE mycode INT; DECLARE tmp_lcode VARCHAR(2) CHARSET gbk; DECLARE lcode INT; DECLARE tmp_rcode VARCHAR(2) CHARSET gbk; DECLARE rcode INT; DECLARE mypy VARCHAR(255) CHARSET gbk DEFAULT ''; DECLARE lp INT; SET mycode = 0; SET lp = 1; SET NAME = HEX(NAME); WHILE lp < LENGTH(NAME) DO SET tmp_lcode = SUBSTRING(NAME, lp, 2); SET lcode = CAST(ASCII(UNHEX(tmp_lcode)) AS UNSIGNED); SET tmp_rcode = SUBSTRING(NAME, lp + 2, 2); SET rcode = CAST(ASCII(UNHEX(tmp_rcode)) AS UNSIGNED); IF lcode > 128 THEN SET mycode =65536 - lcode * 256 - rcode ; SELECT CONCAT(mypy,pin_yin_) INTO mypy FROM t_base_pinyin WHERE CODE_ >= ABS(mycode) ORDER BY CODE_ ASC LIMIT 1; SET lp = lp + 4; ELSE SET mypy = CONCAT(mypy,CHAR(CAST(ASCII(UNHEX(SUBSTRING(NAME, lp, 2))) AS UNSIGNED))); SET lp = lp + 2; END IF; END WHILE; RETURN LOWER(mypy); END;
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
java學(xué)生管理系統(tǒng)界面簡(jiǎn)單實(shí)現(xiàn)(全)
這篇文章主要為大家詳細(xì)介紹了java學(xué)生管理系統(tǒng)界面的簡(jiǎn)單實(shí)現(xiàn),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-01-01Maven多模塊之父子關(guān)系的創(chuàng)建
這篇文章主要介紹了Maven多模塊之父子關(guān)系的創(chuàng)建,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03深入學(xué)習(xí)java8?中的CompletableFuture
本文主要介紹了java8中的CompletableFuture,CompletableFuture實(shí)現(xiàn)了CompletionStage接口和Future接口,前者是對(duì)后者的一個(gè)擴(kuò)展,增加了異步回調(diào)、流式處理、多個(gè)Future組合處理的能力,使Java在處理多任務(wù)的協(xié)同工作時(shí)更加順暢便利,下文需要的朋友可以參考一下2022-05-05Java編程中的vector類(lèi)用法學(xué)習(xí)筆記
Vector通常被用來(lái)實(shí)現(xiàn)動(dòng)態(tài)數(shù)組,即可實(shí)現(xiàn)自動(dòng)增長(zhǎng)的對(duì)象數(shù)組,和C++一樣vector類(lèi)同樣被Java內(nèi)置,下面就來(lái)看一下vector類(lèi)的基本用法.2016-05-05Java通過(guò)在主循環(huán)中判斷Boolean來(lái)停止線(xiàn)程的方法示例
這篇文章主要介紹了Java通過(guò)在主循環(huán)中判斷Boolean來(lái)停止線(xiàn)程的方法,結(jié)合具體實(shí)例形式分析了java針對(duì)線(xiàn)程的判斷與停止操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-04-04Spring Boot啟動(dòng)流程斷點(diǎn)過(guò)程解析
這篇文章主要介紹了Spring Boot啟動(dòng)流程斷點(diǎn)過(guò)程解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-11-11java Unicode和UTF-8之間轉(zhuǎn)換實(shí)例
這篇文章主要介紹了java Unicode和UTF-8之間轉(zhuǎn)換實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-09-09