利用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 相关文章推荐
基于JQuery的6个Tab选项卡插件
Sep 03 Javascript
js判断ie版本号的简单实现代码
Mar 05 Javascript
javascript解三阶幻方(九宫格)
Apr 22 Javascript
微信小程序开发(二)图片上传+服务端接收详解
Jan 11 Javascript
jQuery图片切换动画效果
Feb 28 Javascript
JS ES6中setTimeout函数的执行上下文示例
Apr 27 Javascript
基于Bootstrap模态对话框只加载一次 remote 数据的解决方法
Jul 09 Javascript
微信小程序实现页面跳转传值以及获取值的方法分析
Dec 18 Javascript
页面点击小红心js实现代码
May 26 Javascript
vue elementUI 表单校验功能之数组多层嵌套
Jun 04 Javascript
layui 中select下拉change事件失效的解决方法
Sep 20 Javascript
vue中音频wavesurfer.js的使用方法
Feb 20 Vue.js
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将字符分解为多个字符串的方法
2014/11/22 PHP
php用ini_get获取php.ini里变量值的方法
2015/03/04 PHP
smarty高级特性之过滤器的使用方法
2015/12/25 PHP
Smarty简单生成表单元素的方法示例
2016/05/23 PHP
Smarty日期时间操作方法示例
2016/11/15 PHP
判断目标是否是window,document,和拥有tagName的Element的代码
2010/05/31 Javascript
S2SH整合JQuery+Ajax实现登录验证功能实现代码
2013/01/30 Javascript
jQuery如何获取同一个类标签的所有值(默认无法获取)
2014/09/25 Javascript
JsRender for object语法简介
2014/10/31 Javascript
JS实现左右无缝轮播图代码
2016/05/01 Javascript
第九篇Bootstrap导航菜单创建步骤详解
2016/06/21 Javascript
JavaScript数据类型转换的注意事项
2016/07/31 Javascript
jQuery Easyui DataGrid点击某个单元格即进入编辑状态焦点移开后保存数据
2016/08/15 Javascript
vue中的scope使用详解
2017/10/29 Javascript
JS设计模式之状态模式概念与用法分析
2018/02/05 Javascript
使用node打造自己的命令行工具方法教程
2018/03/26 Javascript
vue.js图片转Base64上传图片并预览的实现方法
2018/08/02 Javascript
EasyUI 数据表格datagrid列自适应内容宽度的实现
2019/07/18 Javascript
JS桶排序的简单理解与实现方法示例
2019/11/25 Javascript
javascript this指向相关问题及改变方法
2020/11/19 Javascript
[14:51]DOTA2 HEROS教学视频教你分分钟做大人-卓尔游侠
2014/06/13 DOTA
介绍Python中几个常用的类方法
2015/04/08 Python
Python文件及目录操作实例详解
2015/06/04 Python
python pandas读取csv后,获取列标签的方法
2018/11/12 Python
对pandas中时间窗函数rolling的使用详解
2018/11/28 Python
【python】matplotlib动态显示详解
2019/04/11 Python
python通过实例讲解反射机制
2019/10/17 Python
使用Keras建立模型并训练等一系列操作方式
2020/07/02 Python
4款Python 类型检查工具,你选择哪个呢?
2020/10/30 Python
Maje德国官网:法国女性成衣品牌
2017/02/10 全球购物
寻找迷宫的一条出路,o通路;X:障碍
2016/07/10 面试题
注塑工厂厂长岗位职责
2013/12/02 职场文书
幼儿园新年寄语
2014/04/03 职场文书
2014年银行年终工作总结
2014/12/19 职场文书
2014年会计主管工作总结
2014/12/20 职场文书
学校体育节班级口号
2015/12/25 职场文书