基于jQuery.Hz2Py.js插件实现的汉字转拼音特效


Posted in Javascript onMay 07, 2015

可以实现基于jQuery实现汉字转换成拼音代码。这是一款基于jQuery.Hz2Py.js插件实现的汉字转拼音特效。插件自行下载。使用方法如下(注意修改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>

演示地址:http://demo.3water.com/js/2015/jQuery-hzzhwpy/

下载地址:https://3water.com/jiaoben/316390.html

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
JavaScript学习笔记记录我的旅程
May 23 Javascript
简单实例处理url特殊符号&amp;处理(2种方法)
Apr 02 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
Dec 19 Javascript
jquery中常用的函数和属性详细解析
Mar 07 Javascript
JQuery对表格进行操作的常用技巧总结
Apr 23 Javascript
node.js中的buffer.length方法使用说明
Dec 14 Javascript
jQuery中:enabled选择器用法实例
Jan 04 Javascript
前端实现文件的断点续传(前端文件提交+后端PHP文件接收)
Nov 04 Javascript
基于AngularJS实现表单验证功能
Jul 28 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
Jun 17 Javascript
基于vue 实现表单中password输入的显示与隐藏功能
Jul 19 Javascript
详解gantt甘特图可拖拽、编辑(vue、react都可用 highcharts)
Nov 27 Vue.js
JavaScript更改字符串的大小写
May 07 #Javascript
JQUERY简单按钮轮换选中效果实现方法
May 07 #Javascript
JS基于面向对象实现的放烟花效果
May 07 #Javascript
jquery中trigger()无法触发hover事件的解决方法
May 07 #Javascript
javascript实现的图片切割多块效果实例
May 07 #Javascript
javascript中indexOf技术详解
May 07 #Javascript
javascript限制文本框输入值类型的方法
May 07 #Javascript
You might like
火影忍者:这才是千手柱间和扉间的真正死因,角都就比较搞笑了!
2020/03/10 日漫
PHP输出XML到页面的3种方法详解
2013/06/06 PHP
单点登录 Ucenter示例分析
2013/10/29 PHP
js简单实现HTML标签Select联动带跳转
2013/10/23 Javascript
JavaScript中的fontsize()方法使用详解
2015/06/08 Javascript
使用Jasmine和Karma对AngularJS页面程序进行测试
2016/03/05 Javascript
很棒的js Tab选项卡切换效果
2016/08/30 Javascript
微信小程序中单位rpx和rem的使用
2016/12/06 Javascript
浅谈JavaScript的计时器对象
2016/12/26 Javascript
基于react组件之间的参数传递(详解)
2017/09/05 Javascript
angularjs通过过滤器返回超链接的方法
2018/10/26 Javascript
用JS实现选项卡
2020/03/23 Javascript
js实现前端界面导航栏下拉列表
2020/08/27 Javascript
Vue.js使用axios动态获取response里的data数据操作
2020/09/08 Javascript
javascript实现拼图游戏
2021/01/29 Javascript
python+mongodb数据抓取详细介绍
2017/10/25 Python
对python列表里的字典元素去重方法详解
2019/01/21 Python
python 类之间的参数传递方式
2019/12/20 Python
Python利用多线程同步锁实现多窗口订票系统(推荐)
2019/12/22 Python
Python3 把一个列表按指定数目分成多个列表的方式
2019/12/25 Python
python GUI库图形界面开发之PyQt5时间控件QTimer详细使用方法与实例
2020/02/26 Python
Python logging模块进行封装实现原理解析
2020/08/07 Python
比利时香水网上商店:NOTINO
2018/03/28 全球购物
应届实习生的自我评价范文
2014/01/05 职场文书
最新茶叶店创业计划书
2014/01/14 职场文书
《藤野先生》教学反思
2014/02/19 职场文书
村级个人对照检查材料
2014/08/22 职场文书
职业生涯规划书怎么写?
2014/09/14 职场文书
银行党员批评与自我批评
2014/10/15 职场文书
2015年七夕情人节活动方案
2015/05/06 职场文书
离婚起诉状范本
2015/05/19 职场文书
投诉书格式范本
2015/07/02 职场文书
2016年公司“3.12”植树节活动总结
2016/03/16 职场文书
nginx location中多个if里面proxy_pass的方法
2021/03/31 Servers
vue3使用vuedraggable实现拖拽功能
2022/04/06 Vue.js
Python写情书? 10行代码展示如何把情书写在她的照片里
2022/04/21 Python