js 获取中文拼音,Select自动匹配字母获取值的代码


Posted in Javascript onSeptember 23, 2009
<script type="text/javascript"> 
var key2code = {65:"a",66:"b",67:"c",68:"d",69:"e",70:"f",71:"g",72:"h",73:"i",74:"j", 
75:"k",76:"l",77:"m",78:"n",79:"o",80:"p",81:"q",82:"r",83:"s",84:"t", 
85:"u",86:"v",87:"w",88:"x",89:"y",90:"z",49:"1",50:"2",51:"3",52:"4", 
53:"5",54:"6",55:"7",56:"8",57:"9",48:"0" 
}; 
</script> 
<script language=javascript> 
var spell = {0xB0A1:"a", 0xB0A3:"ai", 0xB0B0:"an", 0xB0B9:"ang", 0xB0BC:"ao", 0xB0C5:"ba", 0xB0D7:"bai", 0xB0DF:"ban", 0xB0EE:"bang", 0xB0FA:"bao", 0xB1AD:"bei", 0xB1BC:"ben", 0xB1C0:"beng", 0xB1C6:"bi", 0xB1DE:"bian", 0xB1EA:"biao", 0xB1EE:"bie", 0xB1F2:"bin", 0xB1F8:"bing", 0xB2A3:"bo", 0xB2B8:"bu", 0xB2C1:"ca", 0xB2C2:"cai", 0xB2CD:"can", 0xB2D4:"cang", 0xB2D9:"cao", 0xB2DE:"ce", 0xB2E3:"ceng", 0xB2E5:"cha", 0xB2F0:"chai", 0xB2F3:"chan", 0xB2FD:"chang", 0xB3AC:"chao", 0xB3B5:"che", 0xB3BB:"chen", 0xB3C5:"cheng", 0xB3D4:"chi", 0xB3E4:"chong", 0xB3E9:"chou", 0xB3F5:"chu", 0xB4A7:"chuai", 0xB4A8:"chuan", 0xB4AF:"chuang", 0xB4B5:"chui", 0xB4BA:"chun", 0xB4C1:"chuo", 0xB4C3:"ci", 0xB4CF:"cong", 0xB4D5:"cou", 0xB4D6:"cu", 0xB4DA:"cuan", 0xB4DD:"cui", 0xB4E5:"cun", 0xB4E8:"cuo", 0xB4EE:"da", 0xB4F4:"dai", 0xB5A2:"dan", 0xB5B1:"dang", 0xB5B6:"dao", 0xB5C2:"de", 0xB5C5:"deng", 0xB5CC:"di", 0xB5DF:"dian", 0xB5EF:"diao", 0xB5F8:"die", 0xB6A1:"ding", 0xB6AA:"diu", 0xB6AB:"dong", 0xB6B5:"dou", 0xB6BC:"du", 0xB6CB:"duan", 0xB6D1:"dui", 0xB6D5:"dun", 0xB6DE:"duo", 0xB6EA:"e", 0xB6F7:"en", 0xB6F8:"er", 0xB7A2:"fa", 0xB7AA:"fan", 0xB7BB:"fang", 0xB7C6:"fei", 0xB7D2:"fen", 0xB7E1:"feng", 0xB7F0:"fo", 0xB7F1:"fou", 0xB7F2:"fu", 0xB8C1:"ga", 0xB8C3:"gai", 0xB8C9:"gan", 0xB8D4:"gang", 0xB8DD:"gao", 0xB8E7:"ge", 0xB8F8:"gei", 0xB8F9:"gen", 0xB8FB:"geng", 0xB9A4:"gong", 0xB9B3:"gou", 0xB9BC:"gu", 0xB9CE:"gua", 0xB9D4:"guai", 0xB9D7:"guan", 0xB9E2:"guang", 0xB9E5:"gui", 0xB9F5:"gun", 0xB9F8:"guo", 0xB9FE:"ha", 0xBAA1:"hai", 0xBAA8:"han", 0xBABB:"hang", 0xBABE:"hao", 0xBAC7:"he", 0xBAD9:"hei", 0xBADB:"hen", 0xBADF:"heng", 0xBAE4:"hong", 0xBAED:"hou", 0xBAF4:"hu", 0xBBA8:"hua", 0xBBB1:"huai", 0xBBB6:"huan", 0xBBC4:"huang", 0xBBD2:"hui", 0xBBE7:"hun", 0xBBED:"huo", 0xBBF7:"ji", 0xBCCE:"jia", 0xBCDF:"jian", 0xBDA9:"jiang", 0xBDB6:"jiao", 0xBDD2:"jie", 0xBDED:"jin", 0xBEA3:"jing", 0xBEBC:"jiong", 0xBEBE:"jiu", 0xBECF:"ju", 0xBEE8:"juan", 0xBEEF:"jue", 0xBEF9:"jun", 0xBFA6:"ka", 0xBFAA:"kai", 0xBFAF:"kan", 0xBFB5:"kang", 0xBFBC:"kao", 0xBFC0:"ke", 0xBFCF:"ken", 0xBFD3:"keng", 0xBFD5:"kong", 0xBFD9:"kou", 0xBFDD:"ku", 0xBFE4:"kua", 0xBFE9:"kuai", 0xBFED:"kuan", 0xBFEF:"kuang", 0xBFF7:"kui", 0xC0A4:"kun", 0xC0A8:"kuo", 0xC0AC:"la", 0xC0B3:"lai", 0xC0B6:"lan", 0xC0C5:"lang", 0xC0CC:"lao", 0xC0D5:"le", 0xC0D7:"lei", 0xC0E2:"leng", 0xC0E5:"li", 0xC1A9:"lia", 0xC1AA:"lian", 0xC1B8:"liang", 0xC1C3:"liao", 0xC1D0:"lie", 0xC1D5:"lin", 0xC1E1:"ling", 0xC1EF:"liu", 0xC1FA:"long", 0xC2A5:"lou", 0xC2AB:"lu", 0xC2BF:"lv", 0xC2CD:"luan", 0xC2D3:"lue", 0xC2D5:"lun", 0xC2DC:"luo", 0xC2E8:"ma", 0xC2F1:"mai", 0xC2F7:"man", 0xC3A2:"mang", 0xC3A8:"mao", 0xC3B4:"me", 0xC3B5:"mei", 0xC3C5:"men", 0xC3C8:"meng", 0xC3D0:"mi", 0xC3DE:"mian", 0xC3E7:"miao", 0xC3EF:"mie", 0xC3F1:"min", 0xC3F7:"ming", 0xC3FD:"miu", 0xC3FE:"mo", 0xC4B1:"mou", 0xC4B4:"mu", 0xC4C3:"na", 0xC4CA:"nai", 0xC4CF:"nan", 0xC4D2:"nang", 0xC4D3:"nao", 0xC4D8:"ne", 0xC4D9:"nei", 0xC4DB:"nen", 0xC4DC:"neng", 0xC4DD:"ni", 0xC4E8:"nian", 0xC4EF:"niang", 0xC4F1:"niao", 0xC4F3:"nie", 0xC4FA:"nin", 0xC4FB:"ning", 0xC5A3:"niu", 0xC5A7:"nong", 0xC5AB:"nu", 0xC5AE:"nv", 0xC5AF:"nuan", 0xC5B0:"nue", 0xC5B2:"nuo", 0xC5B6:"o", 0xC5B7:"ou", 0xC5BE:"pa", 0xC5C4:"pai", 0xC5CA:"pan", 0xC5D2:"pang", 0xC5D7:"pao", 0xC5DE:"pei", 0xC5E7:"pen", 0xC5E9:"peng", 0xC5F7:"pi", 0xC6AA:"pian", 0xC6AE:"piao", 0xC6B2:"pie", 0xC6B4:"pin", 0xC6B9:"ping", 0xC6C2:"po", 0xC6CB:"pu", 0xC6DA:"qi", 0xC6FE:"qia", 0xC7A3:"qian", 0xC7B9:"qiang", 0xC7C1:"qiao", 0xC7D0:"qie", 0xC7D5:"qin", 0xC7E0:"qing", 0xC7ED:"qiong", 0xC7EF:"qiu", 0xC7F7:"qu", 0xC8A6:"quan", 0xC8B1:"que", 0xC8B9:"qun", 0xC8BB:"ran", 0xC8BF:"rang", 0xC8C4:"rao", 0xC8C7:"re", 0xC8C9:"ren", 0xC8D3:"reng", 0xC8D5:"ri", 0xC8D6:"rong", 0xC8E0:"rou", 0xC8E3:"ru", 0xC8ED:"ruan", 0xC8EF:"rui", 0xC8F2:"run", 0xC8F4:"ruo", 0xC8F6:"sa", 0xC8F9:"sai", 0xC8FD:"san", 0xC9A3:"sang", 0xC9A6:"sao", 0xC9AA:"se", 0xC9AD:"sen", 0xC9AE:"seng", 0xC9AF:"sha", 0xC9B8:"shai", 0xC9BA:"shan", 0xC9CA:"shang", 0xC9D2:"shao", 0xC9DD:"she", 0xC9E9:"shen", 0xC9F9:"sheng", 0xCAA6:"shi", 0xCAD5:"shou", 0xCADF:"shu", 0xCBA2:"shua", 0xCBA4:"shuai", 0xCBA8:"shuan", 0xCBAA:"shuang", 0xCBAD:"shui", 0xCBB1:"shun", 0xCBB5:"shuo", 0xCBB9:"si", 0xCBC9:"song", 0xCBD1:"sou", 0xCBD4:"su", 0xCBE1:"suan", 0xCBE4:"sui", 0xCBEF:"sun", 0xCBF2:"suo", 0xCBFA:"ta", 0xCCA5:"tai", 0xCCAE:"tan", 0xCCC0:"tang", 0xCCCD:"tao", 0xCCD8:"te", 0xCCD9:"teng", 0xCCDD:"ti", 0xCCEC:"tian", 0xCCF4:"tiao", 0xCCF9:"tie", 0xCCFC:"ting", 0xCDA8:"tong", 0xCDB5:"tou", 0xCDB9:"tu", 0xCDC4:"tuan", 0xCDC6:"tui", 0xCDCC:"tun", 0xCDCF:"tuo", 0xCDDA:"wa", 0xCDE1:"wai", 0xCDE3:"wan", 0xCDF4:"wang", 0xCDFE:"wei", 0xCEC1:"wen", 0xCECB:"weng", 0xCECE:"wo", 0xCED7:"wu", 0xCEF4:"xi", 0xCFB9:"xia", 0xCFC6:"xian", 0xCFE0:"xiang", 0xCFF4:"xiao", 0xD0A8:"xie", 0xD0BD:"xin", 0xD0C7:"xing", 0xD0D6:"xiong", 0xD0DD:"xiu", 0xD0E6:"xu", 0xD0F9:"xuan", 0xD1A5:"xue", 0xD1AB:"xun", 0xD1B9:"ya", 0xD1C9:"yan", 0xD1EA:"yang", 0xD1FB:"yao", 0xD2AC:"ye", 0xD2BB:"yi", 0xD2F0:"yin", 0xD3A2:"ying", 0xD3B4:"yo", 0xD3B5:"yong", 0xD3C4:"you", 0xD3D9:"yu", 0xD4A7:"yuan", 0xD4BB:"yue", 0xD4C5:"yun", 0xD4D1:"za", 0xD4D4:"zai", 0xD4DB:"zan", 0xD4DF:"zang", 0xD4E2:"zao", 0xD4F0:"ze", 0xD4F4:"zei", 0xD4F5:"zen", 0xD4F6:"zeng", 0xD4FA:"zha", 0xD5AA:"zhai", 0xD5B0:"zhan", 0xD5C1:"zhang", 0xD5D0:"zhao", 0xD5DA:"zhe", 0xD5E4:"zhen", 0xD5F4:"zheng", 0xD6A5:"zhi", 0xD6D0:"zhong", 0xD6DB:"zhou", 0xD6E9:"zhu", 0xD7A5:"zhua", 0xD7A7:"zhuai", 0xD7A8:"zhuan", 0xD7AE:"zhuang", 0xD7B5:"zhui", 0xD7BB:"zhun", 0xD7BD:"zhuo", 0xD7C8:"zi", 0xD7D7:"zong", 0xD7DE:"zou", 0xD7E2:"zu", 0xD7EA:"zuan", 0xD7EC:"zui", 0xD7F0:"zun", 0xD7F2:"zuo"} 
var spellArray = new Array() 
var pn = "" 
/*for (var i=0xB0A1; i<0xD7FC; i++) 
{ 
if (spell[i]) pn = spell[i] 
execScript("char=chr(\""+i+"\")", "vbscript") 
spellArray[char.charCodeAt(0)] = pn 
}*/ 
function pinyin(char) 
{ 
if (!char.charCodeAt(0) ||char.charCodeAt(0) < 1328) return char; 
if (spellArray[char.charCodeAt(0)]) return spellArray[char.charCodeAt(0)] 
execScript("ascCode=hex(asc(\""+char+"\"))", "vbscript") 
ascCode = eval("0x"+ascCode) 
if (!(ascCode>0xB0A0 && ascCode<0xD7FC)) return char; 
for (var i=ascCode; (!spell[i] && i>0);) i-- 
return spell[i] 
} 
function toPinyin(str) 
{ 
var pStr = "" 
for (var i=0; i<str.length; i++) 
{ 
if (str.charAt(i) == "\n") pStr += "<br>" 
else pStr += "<ruby style='ruby-align:center'> "+str.charAt(i) + " <rt>"+pinyin(str.charAt(i)) + "</rt></ruby>" 
//else pStr += pinyin(str.charAt(i)) + " " 
} 
return pStr 
} 
function toPinyinOnly(str) 
{ 
var pStr = "" 
for (var i=0; i<str.length; i++) 
{ 
if (str.charAt(i) == "\n") pStr += "<br>" 
else pStr += " "+pinyin(str.charAt(i)) ; 
//else pStr += pinyin(str.charAt(i)) + " " 
} 
return pStr 
} 
function toPinyinShengmu(str) 
{ 
var pStr = "" 
for (var i=0; i<str.length; i++) 
{ 
if (str.charAt(i) == "\n") pStr += ""; 
else pStr += pinyin(str.charAt(i)).charAt(0) ; 
//else pStr += pinyin(str.charAt(i)) + " " 
} 
return pStr 
} 
function pinyinSort(a, b) 
{ 
var rValue = 0 
for (var i=0; i<a.length; i++) 
{ 
var pinA = pinyin(a.charAt(i)) 
var pinB = pinyin(b.charAt(i)) 
if (rValue = pinA > pinB ? 1 : pinA < pinB ? -1 : 0) break 
} 
return rValue 
} 
</script> 
<textarea id=kevin cols=100 rows=10>小狗收藏贴</textarea><br> 
<button onclick="test.innerHTML = toPinyin(kevin.innerText)">转换</button> 
<button onclick="test.innerHTML = toPinyinShengmu(kevin.innerText)">转换sm</button> 
<button onclick="test.innerHTML = toPinyinOnly(kevin.innerText)">仅拼音</button> 
<button onclick="test.innerHTML = kevin.innerText.split('').sort(pinyinSort).join('')">排序</button> 
<div id=test style="font-size:16px;"></div> 
select选择,支持中文 
#先选择select,按下键盘字母,option根据所输入字母自动选择匹配的中文,如果要重新选择,按space键盘 
改变option顺序 
<select id="sel" onkeydown="showOptions2(this)" onfocus="inp='';"> 
<option value=1>中国</option> 
<option value=1>北京</option> 
<option value=1>北京1北京</option> 
<option value=1>北京1南京</option> 
<option value=1>北京2</option> 
<option value=1>北京3</option> 
<option value=1>上海</option> 
<option value=1>天津</option> 
<option value=1>天津人口</option> 
<option value=1>人口</option> 
<option value=1>人们</option> 
<option value=1>人民</option> 
</select> 
不改变option顺序 
<select id="sel" onkeydown="showOptions(this)" onfocus="inp='';"> 
<option value=1>中国</option> 
<option value=1>北京</option> 
<option value=1>北京1北京</option> 
<option value=1>北京1南京</option> 
<option value=1>北京2</option> 
<option value=1>北京3</option> 
<option value=1>上海</option> 
<option value=1>天津</option> 
<option value=1>天津人口</option> 
<option value=1>人口</option> 
<option value=1>人们</option> 
<option value=1>人民</option> 
</select> 
<script type='text/javascript'> 
var inp = ""; 
function showOptions(obj){ 
if(event.keyCode==32){ 
inp =""; 
return; 
} 
var tmp = inp; 
tmp += key2code[event.keyCode]?key2code[event.keyCode]:""; 
var someNodeList = obj.getElementsByTagName('option'); 
var index = -1; 
for(var i=0;i<someNodeList.length;i++){ 
var sm = toPinyinShengmu(someNodeList[i].innerHTML); 
if(sm.indexOf(tmp)==0){ 
index = i; 
break; 
} 
} 
if(index>=0){ 
obj.selectedIndex = index; 
inp = tmp; 
} 
} 
function showOptions2(obj){ 
if(event.keyCode==32){ 
inp =""; 
return; 
} 
var tmp = inp; 
tmp += key2code[event.keyCode]?key2code[event.keyCode]:""; 
var someNodeList = obj.getElementsByTagName('option'); 
var index = -1; 
var choose = []; 
for(var i=someNodeList.length-1;i>0;i--){ 
var sm = toPinyinShengmu(someNodeList[i].innerHTML); 
if(sm.indexOf(tmp)==0){ 
inp = tmp; 
choose[choose.length] = someNodeList[i]; 
obj.removeChild(someNodeList[i]); 
} 
} 
if(choose.length>0){ 
someNodeList = obj.getElementsByTagName('option'); 
var len = someNodeList.length; 
for(var i=0;i<len;i++){ 
choose[choose.length] = someNodeList[i]; 
} 
for(var i=0;i<choose.length;i++){ 
obj.appendChild(choose[i]); 
} 
obj.selectedIndex = 0; 
} 
someNodeList = null; 
choose = null; 
} 
</script>
Javascript 相关文章推荐
textarea 控制输入字符字节数(示例代码)
Dec 27 Javascript
在firefox和Chrome下关闭浏览器窗口无效的解决方法
Jan 16 Javascript
22点关于jquery性能优化的建议
May 28 Javascript
JavaScript数组前面插入元素的方法
Apr 06 Javascript
AngularJS表格样式简单设置方法示例
Mar 03 Javascript
jquery 禁止鼠标右键并监听右键事件
Apr 27 jQuery
详解react-router如何实现按需加载
Jun 15 Javascript
浅谈jQuery框架Ajax常用选项
Jul 08 jQuery
Vue自定义指令详解
Jul 28 Javascript
Vue.js移动端左滑删除组件的实现代码
Sep 08 Javascript
Angular利用HTTP POST下载流文件的步骤记录
Jul 26 Javascript
React更新渲染原理深入分析
Dec 24 Javascript
jquery ajax 登录验证实现代码
Sep 23 #Javascript
比较全面的event对像在IE与FF中的区别 推荐
Sep 21 #Javascript
javascript 必知必会之closure
Sep 21 #Javascript
用JavaScript隐藏控件的方法
Sep 21 #Javascript
jquery 子窗口操作父窗口的代码
Sep 21 #Javascript
通过JS 获取Mouse Position(鼠标坐标)的代码
Sep 21 #Javascript
用jQuery技术实现Tab页界面之二
Sep 21 #Javascript
You might like
PHP图像处理类库MagickWand用法实例分析
2015/05/21 PHP
PHP读MYSQL中文乱码的快速解决方法
2016/10/01 PHP
PHP绕过open_basedir限制操作文件的方法
2018/06/10 PHP
什么是MEAN?JavaScript编程中的MEAN是什么意思?
2014/12/18 Javascript
javascript面向对象快速入门实例
2015/01/13 Javascript
jQuery实现带滚动导航效果的全屏滚动相册实例
2015/06/19 Javascript
JavaScript DOM 对象深入了解
2016/07/20 Javascript
jQuery EasyUI Tab 选项卡问题小结
2016/08/16 Javascript
js实现表单及时验证功能 用户信息立即验证
2016/09/13 Javascript
关于Node.js的events.EventEmitter用法介绍
2017/04/01 Javascript
微信小程序实现轮播图效果
2017/09/07 Javascript
基于vue-cli配置lib-flexible + rem实现移动端自适应
2017/12/26 Javascript
JavaScript中利用Array filter() 方法压缩稀疏数组
2018/02/24 Javascript
JavaScript中使用import 和require打包后实现原理分析
2018/03/07 Javascript
如何在Angular8.0下使用ngx-translate进行国际化配置
2019/07/24 Javascript
javascript实现视频弹幕效果(两个版本)
2019/11/28 Javascript
js构造函数constructor和原型prototype原理与用法实例分析
2020/03/02 Javascript
js获取图片的base64编码并压缩
2020/12/05 Javascript
js 执行上下文和作用域的相关总结
2021/02/08 Javascript
python3序列化与反序列化用法实例
2015/05/26 Python
全面了解Python的getattr(),setattr(),delattr(),hasattr()
2016/06/14 Python
python制作爬虫爬取京东商品评论教程
2016/12/16 Python
django 开发忘记密码通过邮箱找回功能示例
2018/04/17 Python
Python3.x爬虫下载网页图片的实例讲解
2018/05/22 Python
python中必要的名词解释
2019/11/20 Python
windows上彻底删除jupyter notebook的实现
2020/04/13 Python
让Django的BooleanField支持字符串形式的输入方式
2020/05/20 Python
Stylenanda中文站:韩国一线网络服装品牌
2016/12/22 全球购物
四川internet信息高速公路(C#)笔试题
2012/02/29 面试题
学校后勤人员职责
2013/12/27 职场文书
《小松树和大松树》教学反思
2014/02/20 职场文书
《美丽的小兴安岭》教学反思
2014/02/26 职场文书
弄虚作假心得体会
2014/09/10 职场文书
房产公证委托书范本
2014/09/20 职场文书
优秀范文:《但愿人长久》教学反思3篇
2019/10/24 职场文书
详解Go语言运用广度优先搜索走迷宫
2021/06/23 Python