利用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 相关文章推荐
用js实现的检测浏览器和系统的函数
Apr 09 Javascript
jQuery中使用了document和window哪些属性和方法小结
Sep 13 Javascript
js验证模型自我实现的具体方法
Jun 21 Javascript
父页面显示遮罩层弹出半透明状态的dialog
Mar 04 Javascript
JavaScript中判断原生函数检查function是否是原生代码
Sep 09 Javascript
Sort()函数的多种用法
Mar 20 Javascript
详解如何较好的使用js
Dec 16 Javascript
用javascript获取任意颜色的更亮或更暗颜色值示例代码
Jul 21 Javascript
AngularJS2 与 D3.js集成实现自定义可视化的方法
Dec 01 Javascript
layer.open 按钮的点击事件关闭方法
Aug 17 Javascript
vuex + axios 做登录验证 并且保存登录状态的实例
Sep 16 Javascript
一篇文章带你使用Typescript封装一个Vue组件(简单易懂)
Jun 05 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中iconv函数转码时截断字符问题的解决方法
2015/01/21 PHP
PHP 实现字符串翻转(包含中文汉字)的实现代码
2017/04/01 PHP
Yii2语言国际化自动配置详解
2018/08/22 PHP
laravel实现于语言包的完美切换方法
2019/09/29 PHP
PHP读取文件或采集时解决中文乱码
2021/03/09 PHP
网页javascript精华代码集
2007/01/24 Javascript
Javascript的一种模块模式
2008/03/22 Javascript
关于递归运算的顺序测试代码
2011/11/30 Javascript
javascript面向对象包装类Class封装类库剖析
2013/01/24 Javascript
JS小功能(onmouseover实现选择月份)实例代码
2013/11/28 Javascript
Javascript类型系统之String字符串类型详解
2016/06/21 Javascript
解析javascript图片懒加载与预加载的分析总结
2016/10/27 Javascript
关于Vue.js一些问题和思考学习笔记(1)
2016/12/02 Javascript
JS对象的深度克隆方法示例
2017/03/16 Javascript
详解Vue-基本标签和自定义控件
2017/03/24 Javascript
bootstrap中selectpicker下拉框使用方法实例
2018/03/22 Javascript
从源码里了解vue中的nextTick的使用
2018/11/22 Javascript
vue自定义树状结构图的实现方法
2020/10/18 Javascript
Python ORM框架SQLAlchemy学习笔记之关系映射实例
2014/06/10 Python
python里大整数相乘相关技巧指南
2014/09/12 Python
python+openCV利用摄像头实现人员活动检测
2019/06/22 Python
python的pytest框架之命令行参数详解(下)
2019/06/27 Python
python pandas cumsum求累计次数的用法
2019/07/29 Python
使用python写一个自动浏览文章的脚本实例
2019/12/05 Python
Python批量启动多线程代码实例
2020/02/18 Python
css3中的calc函数浅析
2018/07/10 HTML / CSS
Html5 APP中监听返回事件处理的方法示例
2018/03/15 HTML / CSS
出门问问全球官方商城:Tichome音箱和TicWatch智能手表
2017/12/02 全球购物
俄罗斯小米家用电器、电子产品和智能家居商店:Poood.ru
2020/04/03 全球购物
经济学博士求职自荐信范文
2013/11/23 职场文书
专业幼师实习生自我鉴定范文
2013/12/08 职场文书
优秀本科生求职推荐信
2014/02/24 职场文书
人力资源管理毕业生自荐信
2014/06/26 职场文书
企业工会工作总结2015
2015/05/13 职场文书
使用@Value值注入及配置文件组件扫描
2021/07/09 Java/Android
SpringBoot详解整合Redis缓存方法
2022/07/15 Java/Android