Mikel
来源： js如何简单实现汉字转成拼音的功能 – 小小邪 – 博客园
最近项目需要一个功能，实现汉字转拼音功能，具体比如说输入一个“你好”，同时带出对应拼音“NiHao”，在此做一下记录
1、首先引入两个文件
<script src="jquery.min.js"></script>
<script src="Convert_Pinyin.js"></script>
2、html设计
<body>
<div>
输入名称：<input type="text" id="chinaName" onBlur="ConvertName()" /> <br/>
全写拼音：<input type="text" id="fullName" /> <br/>
简写拼音：<input type="text" id="easyName" /> <br/>
</div>
</body>
3、js方法
<script>
var ConvertName = function(){
var chinaName = $('#chinaName').val();
//获取全写拼音（调用js中方法）
var fullName = pinyin.getFullChars(chinaName);
//获取简写拼音（调用js中方法）
var easyName = pinyin.getCamelChars(chinaName);
//给两个文本框赋值
$('#fullName').val(fullName);
$('#easyName').val(easyName);
}
</script>
4、实现效果
5、整体demo
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>如何实现汉字转拼音功能</title>
</head>
<script src="jquery.min.js"></script>
<script src="Convert_Pinyin.js"></script>
<script>
var ConvertName = function(){
var chinaName = $('#chinaName').val();
//获取全写拼音（调用js中方法）
var fullName = pinyin.getFullChars(chinaName);
//获取简写拼音（调用js中方法）
var easyName = pinyin.getCamelChars(chinaName);
//给两个文本框赋值
$('#fullName').val(fullName);
$('#easyName').val(easyName);
}
</script>
<body>
<div>
输入名称：<input type="text" id="chinaName" onBlur="ConvertName()" /> <br/>
全写拼音：<input type="text" id="fullName" /> <br/>
简写拼音：<input type="text" id="easyName" /> <br/>
</div>
</body>
</html>
6、汉字转拼音js下载路径：
链接：https://pan.baidu.com/s/1NZ4noIgHv2HSzZW6yBRTxA 密码：2kv1
平时多记记，到用时才能看看，记录你的进步，分享你的成果
