王小胖之中文汉字转拼音

使用场景：看到一个字不知道读音，那么可以复制然后查一下。

实现功能：输入汉字，转换成带音标的读音，重点是能显示音标，便于学习读音。

数据实例：输入：“王小胖顶呱呱~~”  输出：“wáng xiǎo pàng dǐng guā guā ~~”

功能实现：

 

html代码

<div class="input-group">
                      <input name="kw" type="text" class="form-control" placeholder="汉字"  id="hanzi" value="王小胖顶呱呱~~">
                      <div class="input-group-btn">
                        <button type="submit" class="btn btn-success"  id="convert">转换</button>
                      </div>
</div><!-- /.input-group -->
            

 

JS 代码

                 $(function(){
                      $("#convert").click(function(){
                          lower= $("#hanzi").val();
                          upper=trans(lower);
                          $("#pinyin").val(upper);
                      });
                  });

                  //转换
                  function trans(p){
                        var cc=p
                        var str='',str2;
                        var s;
                        for(var i=0;i<cc.length;i++){
                            if(pydic.indexOf(cc.charAt(i))!=-1&&cc.charCodeAt(i)>200){
                                s=1;
                                while(pydic.charAt(pydic.indexOf(cc.charAt(i))+s)!=","){
                                    str+=pydic.charAt(pydic.indexOf(cc.charAt(i))+s);
                                    s++;
                                }
                                str+=" ";
                            }
                            else{
                                str+=cc.charAt(i);
                            }
                        }
                        return str;
                }

中间需要使用一个JS文件，可以直接在线查看：http://www.wxp123.me/Public/js/pinyin/pinyin.js

 

--------------------------------------------------------------------------------------------------------------------------

不爱说话，一切以代码为主，其他 全靠悟性！

中文转拼音：http://www.wxp123.me/Index/detail/id/11.html

王小胖个人博客地址：http://blog.wxp123.me/p/54