Home > Web Front-end > JS Tutorial > Chinese character conversion to pinyin special effects based on jQuery.Hz2Py.js plug-in_jquery

Chinese character conversion to pinyin special effects based on jQuery.Hz2Py.js plug-in_jquery

WBOY
Release: 2016-05-16 16:00:34
Original
2641 people have browsed it

Can convert Chinese characters into pinyin codes based on jQuery. This is a Chinese character to Pinyin special effect implemented based on the jQuery.Hz2Py.js plug-in. The plug-in is downloaded by itself. The usage method is as follows (note to modify the import path of jq).

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>基于jQuery实现汉字转换成拼音代码</title>
<style type="text/css">
#content{
border: 1px #dbdbdb solid;
width: 700px;
height: 50px;
padding: 10px;
font-size: 13px;
line-height: 23px;
letter-spacing: 15px;
}
#show{
border: 1px #dbdbdb solid;
width: 700px;
height: 50px;
padding: 10px;
font-size: 12px;
color: #FF0000;
line-height: 23px;
margin-top: 2px;
letter-spacing: 1px;
overflow-x: hide;
overflow-y: auto;
}
#show a {
color: #FF0000;
font-size: 13px;
font-weight: bold;
}
</style>
 
<script src="js/jquery.min.js"></script>
 
<script type="text/javascript" src="js/jQuery.Hz2Py-min.js"></script>
 
<script type="text/javascript">
    $(function () {
      $("#content").live("keyup keydown change blur", function () {
        $("#show").val($(this).toPinyin());
      });
    });
  </script>
 </head><body>
<center>
  在这里输入汉字 <textarea id="content"> </textarea> <textarea id="show"></textarea>
</center></body></html>
Copy after login

Demo address: http://demo.jb51.net/js/2015/jQuery-hzzhwpy/

Download address: http://www.jb51.net/jiaoben/316390.html

The above is the entire content of this article, I hope you all like it.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template