文献种类:专题技术文献;
开发工具与关键技术:Visual Studio 2015 拼音的生成
作者: ;年级: ;撰写时间: 年 月 日
文献编号: ;归档时间: 月 日
自动生成拼音
开发工具与关键技术:Visual
Studio 2015 拼音的生成
作者:廖 茂
撰写时间:2019年06月06日
在项目中,你会遇到各种各样的需求,需要实现多个功能,接下来要说的是如何实现输入名字,然后会自动生成拼音并且显示出来。
首先我们看一下功能实现后的效果,如下:
可以看到,在左边的文本框分别输入姓氏和名字,右边的文本框会自动生成与其对应的拼音,并且拼音可以自行修改,那么要如何实现这个功能,接下来就进入代码的编写。
首先需要四个文本框,如下:
上面就是四个文本框的HTML代码,四个文本框都需要添加上ID,用于后面方法的编写。在编写方法之前,我们需要用引用两个js,如下:
引用jquery.min.js是因为编写方法时需要用到jquery的写法,Convert_Pinyin.js就是生成拼音所需要的最基本的js,里面有生成拼音的方法,并且有两种方法,第一种是获取全写拼音,第二种是获取简写拼音。
引用完js后,就进入js方法的编写,先编写第一种获取全写拼音的方法。
首先我们需要以ID为依据获取到左边两个文本框的值,并且分别赋值给两个变量,如下:
这样就获取到了两个文本框的值,然后开始获取全写拼音,如下:
这两句代码是分别获取前面两个变量,就是两个文本框的值相对应的拼音并且分别赋值给两个变量,“getFullChars”是获取全写拼音的方法,这样就获取到拼音了,接下来需要做的是以ID为依据,将存放拼音的两个变量赋值给右边两个文本框,让拼音显示出来,如下:
这样获取全写拼音的方法就编写完毕了,效果已在上面展示过了就不再重复展示,下面接着编写获取简写拼音的方法。
简写拼音的获取与全写拼音的获去方法相差不大,都是先获取左边两个文本框的值,然后再获取对应的简写拼音,最后在把拼音赋值给右边的两个文本框让拼音显示出来,唯一的区别就是获取拼音时用的一个方法是“getCamelChars”,而获取全写拼音用的是“getFullChars”,获取简写拼音的方法如下:
在页面的效果如下:
拼音生成的方法就是这样,分别有简写拼音和全写拼音的获取,往往在一些项目中需要用到。