基于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 相关文章推荐
Dojo之路:如何利用Dojo实现Drag and Drop效果
Apr 10 Javascript
javascript之dhDataGrid Ver2.0.0代码
Jul 01 Javascript
jquery 简单图片导航插件jquery.imgNav.js
Mar 17 Javascript
JS验证日期的格式YYYY-mm-dd 具体实现
Jun 29 Javascript
javascript基本算法汇总
Mar 09 Javascript
JS判断鼠标进入容器的方向与window.open新窗口被拦截的问题
Dec 23 Javascript
详解vue 中使用 AJAX获取数据的方法
Jan 18 Javascript
BootStrap Datepicker 插件修改为默认中文的实现方法
Feb 10 Javascript
详解单页面路由工程使用微信分享及二次分享解决方案
Feb 22 Javascript
微信小程序实现的绘制table表格功能示例
Apr 26 Javascript
Vue是怎么渲染template内的标签内容的
Jun 05 Javascript
解决vue 给window添加和移除resize事件遇到的坑
Jul 21 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
CI框架入门示例之数据库取数据完整实现方法
2014/11/05 PHP
php通过ksort()函数给关联数组按照键排序的方法
2015/03/18 PHP
php显示时间常用方法小结
2015/06/05 PHP
laravel5.4利用163邮箱发送邮件的步骤详解
2017/09/22 PHP
Laravel 模型关联基础教程详解
2019/09/17 PHP
firefox下对ajax的onreadystatechange的支持情况分析
2009/12/14 Javascript
javascript下string.format函数补充
2010/08/24 Javascript
jquery 插件学习(五)
2012/08/06 Javascript
Javascript表格翻页效果实现思路及代码
2013/08/23 Javascript
js实现动态改变字体大小代码
2014/01/02 Javascript
浅谈Javascript 数组与字典
2015/01/29 Javascript
JS日期格式化之javascript Date format
2015/10/01 Javascript
js操作数据库实现注册和登陆的简单实例
2016/05/26 Javascript
Jquery中map函数的用法
2016/06/03 Javascript
全面接触神奇的Bootstrap导航条实战篇
2016/08/01 Javascript
微信小程序购物商城系统开发系列-目录结构介绍
2016/11/21 Javascript
详解nodejs微信公众号开发——1.接入微信公众号
2017/04/10 NodeJs
jQuery Easyui Treegrid实现显示checkbox功能
2017/08/08 jQuery
JS实现模糊查询带下拉匹配效果
2018/06/21 Javascript
Vue 实现登录界面验证码功能
2020/01/03 Javascript
Vue 组件注册全解析
2020/12/17 Vue.js
pycharm 使用心得(六)进行简单的数据库管理
2014/06/06 Python
Python中函数的参数定义和可变参数用法实例分析
2015/06/04 Python
python使用PIL模块获取图片像素点的方法
2019/01/08 Python
python selenium爬取斗鱼所有直播房间信息过程详解
2019/08/09 Python
Python转换字典成为对象,可以用&quot;.&quot;方式访问对象属性实例
2020/05/11 Python
用python对excel进行操作(读,写,修改)
2020/12/25 Python
Bibloo匈牙利:女装、男装、童装及鞋子和配饰
2019/04/14 全球购物
丽笙酒店官方网站:Radisson Hotels
2019/05/07 全球购物
AURALog面试题软件测试方面
2013/10/22 面试题
大专生自荐信
2013/10/04 职场文书
工程管理造价应届生求职信
2013/11/13 职场文书
《与象共舞》教学反思
2014/02/24 职场文书
新闻专业毕业生英文求职信
2014/03/19 职场文书
餐饮店长岗位职责
2015/04/14 职场文书
学习委员竞选稿
2015/11/20 职场文书