利用jquery包将字符串生成二维码图片


Posted in Javascript onSeptember 12, 2013

将一个字符串(可以是中文,在生成二维码图片之前将中文转码)生成二维码图片,如果想要带log的二维码,可以在生成后的二维码中间部位自己添加一个小log,log图片不要太大,不然就扫描不出内容了。

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<title></title> 

<script src="js/jquery-1.8.3.js" type="text/javascript"></script> 

<script src="js/qrcode.js" type="text/javascript"></script> 

<script src="js/jquery.qrcode.js" type="text/javascript"></script> 

<script type="text/javascript"> 

$(function () { 

$("#bt").bind("click", function () { 

text = $("#text").val(); 

$("#div_div").qrcode(utf16to8(text)); 
}) 

}) 

function utf16to8(str) { //转码 

var out, i, len, c; 

out = ""; 

len = str.length; 

for (i = 0; i < len; i++) { 

c = str.charCodeAt(i); 

if ((c >= 0x0001) && (c <= 0x007F)) { 

out += str.charAt(i); 

} else if (c > 0x07FF) { 

out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F)); 

out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F)); 

out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); 

} else { 

out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F)); 

out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); 

} 

} 

return out; 

} 

</script> 

</head> 

<body> 

<input type="text" id="text" /> 

<input type="button" value="shengc" id="bt" /> 

<div id="div_div" style="width:400px;height:400px;border:1px solid #000;"></div> 

</body> 

</html>

这里引用了三个js包,其中一个是jquery包,这个随便版本,另外两个就是画二维码用的js包了。

js包下载http://download.csdn.net/detail/anxin591025/6254607

PS:这里再提供一个本站的二维码生成工具加强版(带logo与各种定制功能)供大家使用:

Javascript 相关文章推荐
基于mouseout和mouseover等类似事件的冒泡问题解决方法
Nov 18 Javascript
javascript删除元素节点removeChild()用法实例
May 26 Javascript
jquery动态导航插件dynamicNav用法实例分析
Sep 06 Javascript
基于jQuery倾斜打开侧边栏菜单特效代码
Sep 15 Javascript
JS实现自动固定顶部的悬浮菜单栏效果
Sep 16 Javascript
实例详解jQuery Mockjax 插件模拟 Ajax 请求
Jan 12 Javascript
js拼接html字符串的注意事项
Oct 13 Javascript
JS多文件上传的实例代码
Jan 11 Javascript
判断div滑动到底部的scroll实例代码
Nov 15 Javascript
vue全局组件与局部组件使用方法详解
Mar 29 Javascript
vue iview实现动态路由和权限验证功能
Apr 17 Javascript
微信小程序调用摄像头隐藏式拍照功能
Aug 22 Javascript
JQuery实现鼠标滑过显示导航下拉列表
Sep 12 #Javascript
JQuery加载图片自适应固定大小的DIV
Sep 12 #Javascript
JS鼠标滑过图片时切换图片实现思路
Sep 12 #Javascript
jQuery实现图片放大预览实现原理及代码
Sep 12 #Javascript
jquery foreach使用示例
Sep 12 #Javascript
jquery 追加tr和删除tr示例代码
Sep 12 #Javascript
实现只能输入数字的input不用replace方法
Sep 12 #Javascript
You might like
PHP Pear 安装及使用
2009/03/19 PHP
php源码之将图片转化为data/base64数据流实例详解
2016/11/27 PHP
Yii 框架入口脚本示例分析
2020/05/19 PHP
对象的类型:本地对象(1)
2006/12/29 Javascript
预加载css或javascript的js代码
2010/04/23 Javascript
基于JQuery实现鼠标点击文本框显示隐藏提示文本
2012/02/23 Javascript
javascript采用数组实现tab菜单切换效果
2012/12/12 Javascript
javascript弹出层输入框(示例代码)
2013/12/11 Javascript
js输出阴历、阳历、年份、月份、周示例代码
2014/01/29 Javascript
jQuery源码解读之removeClass()方法分析
2015/02/20 Javascript
jQuery实现滚动切换的tab选项卡效果代码
2015/08/26 Javascript
Angularjs结合Bootstrap制作的一个TODO List
2016/08/18 Javascript
详解JS几种变量交换方式以及性能分析对比
2016/11/25 Javascript
vue数据双向绑定原理解析(get &amp; set)
2017/03/08 Javascript
javascript cookie的基本操作(添加和删除)
2017/07/24 Javascript
在angular 6中使用 less 的实例代码
2018/05/13 Javascript
Vue CLI3 如何支持less的方法示例
2018/08/29 Javascript
vue2.0移动端滑动事件vue-touch的实例代码
2018/11/27 Javascript
微信小程序上线发布流程图文详解
2019/05/06 Javascript
有趣的python小程序分享
2017/12/05 Python
理想高通滤波实现Python opencv示例
2019/01/30 Python
python实现全盘扫描搜索功能的方法
2019/02/14 Python
pymysql模块的操作实例
2019/12/17 Python
马来西亚最好的婴儿商店:Motherhood
2017/09/14 全球购物
Sneaker Studio匈牙利:购买运动鞋
2018/03/26 全球购物
卡骆驰新加坡官网:Crocs新加坡
2018/06/12 全球购物
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
关键字final的用法
2013/10/02 面试题
财务与信息服务专业推荐信
2013/11/28 职场文书
道路交通安全实施方案
2014/03/12 职场文书
农村改厕实施方案
2014/03/22 职场文书
小学网上祭英烈活动总结
2014/07/05 职场文书
2014物价局民主生活会对照检查材料思想汇报
2014/09/24 职场文书
党支部对转正的意见
2015/06/02 职场文书
指导教师推荐意见
2015/06/05 职场文书
MybatisPlus EntityWrapper如何自定义SQL
2022/03/22 Java/Android