基于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 相关文章推荐
JQuery 小练习(实例代码)
Aug 07 Javascript
html+js实现动态显示本地时间
Sep 21 Javascript
Jquery 类网页微信二维码图块滚动效果具体实现
Oct 14 Javascript
js实现横向伸展开的二级导航菜单代码
Aug 28 Javascript
JSP基于Bootstrap分页显示实例解析
Jun 12 Javascript
JS中parseInt()和map()用法分析
Dec 16 Javascript
利用JS hash制作单页Web应用的方法详解
Oct 10 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
Jan 21 Javascript
详解VueJS应用中管理用户权限
Feb 02 Javascript
vue项目环境变量配置的实现方法
Oct 12 Javascript
2019最新21个MySQL高频面试题介绍
Feb 06 Javascript
微信小程序getLocation 需要在app.json中声明permission字段
Mar 03 Javascript
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
桌面中心(一)创建数据库
2006/10/09 PHP
解析百度搜索结果link?url=参数分析 (全)
2012/10/09 PHP
ThinkPHP中ajax使用实例教程
2014/08/22 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
javascript 处理事件绑定的一些兼容写法
2009/12/24 Javascript
ExtJS 2.0 GridPanel基本表格简明教程
2010/05/25 Javascript
基于jQuery实现点击同时更改两个iframe的网址
2010/07/01 Javascript
A标签触发onclick事件而不跳转的多种解决方法
2013/06/27 Javascript
通过一段代码简单说js中的this的使用
2013/07/23 Javascript
js登录弹出层特效
2014/03/07 Javascript
javascript实现可全选、反选及删除表格的方法
2015/05/15 Javascript
javascript 使用for循环时该注意的问题-附问题总结
2015/08/19 Javascript
json传值以及ajax接收详解
2016/05/24 Javascript
JavaScript必看小技巧(必看)
2016/06/07 Javascript
jquery ajax后台返回list,前台用jquery遍历list的实现
2016/10/30 Javascript
微信小程序学习之数据处理详解
2017/07/05 Javascript
create-react-app修改为多页面支持的方法
2018/05/17 Javascript
JavaScript实现轮播图片完整代码
2020/03/07 Javascript
浅谈js数组splice删除某个元素爬坑
2020/10/14 Javascript
Python时区设置方法与pytz查询时区教程
2013/11/27 Python
python创建线程示例
2014/05/06 Python
Python实现读取txt文件中的数据并绘制出图形操作示例
2019/02/26 Python
Python+Kepler.gl实现时间轮播地图过程解析
2020/07/20 Python
python使用隐式循环快速求和的实现示例
2020/09/11 Python
Zavvi美国:英国娱乐之家
2017/03/19 全球购物
大学应届生求职简历的自我评价
2013/10/08 职场文书
中专毕业生的自我鉴定
2013/12/01 职场文书
代理商会议邀请函
2014/01/27 职场文书
求职个人评价范文
2014/04/09 职场文书
小学先进集体事迹材料
2014/05/31 职场文书
就业协议书盖章的注意事项
2014/09/28 职场文书
2015年员工工作总结范文
2015/04/08 职场文书
申请吧主发表的感言
2015/08/03 职场文书
《祁黄羊》教学反思
2016/02/20 职场文书
vue 自定义组件添加原生事件
2022/04/21 Vue.js
SpringBoot深入分析讲解监听器模式下
2022/07/15 Java/Android