基于JavaScript实现生成名片、链接等二维码


Posted in Javascript onSeptember 20, 2015

废话不多说,直接贴代码了,具体内容如下;

<div id = "qrcodeid"></div> //生成的二维码放在此 div 中
<script type="text/javascript" src="js/jquery.qrcode.min.js"></script>//引入qrcode.js(到https://github.com/jeromeetienne/jquery-qrcode 下载 )
<script>
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>
<script>//此处生成名片二维码(如要生成普通链接二维码 则 “text”参数值 直接替换成普通链接即可)
var the_text = "BEGIN:VCARD \r\nFN:姓名 \r\nTEL;CELL,VOICE:15000000000 \r\nTITLE:职称 \r\nORG:公司(组织) \r\nEMAIL;INTERNET,HOME:123@qq.com \r\nADR;WORK,POSTAL:地球中国山东... \r\nURL:http://leerd.cn \r\nEND:VCARD";
the_text = utf16to8(the_text);
//alert(the_text);
jQuery('#qrcodeid').qrcode({
width:140,
height:140,
render:"canvas", //设置渲染方式 table canvas
typeNumber : -1,  //计算模式 
correctLevel  : 0,//纠错等级 
background   : "#ffffff",//背景颜色 
foreground   : "#000000",//前景颜色 
text:the_text
}); 
</script>

以上内容就是本文的全部内容,希望大家喜欢。

Javascript 相关文章推荐
TextArea 控件的最大长度问题(js json)
Dec 16 Javascript
js 点击按钮弹出另一页,选择值后,返回到当前页
May 26 Javascript
动态载入/删除/更新外部 JavaScript/Css 文件的代码
Jul 03 Javascript
JS获得URL超链接的参数值实例代码
Jun 21 Javascript
JS实现先显示大图后自动收起显示小图的广告代码
Sep 04 Javascript
全面解析Bootstrap表单使用方法(表单样式)
Nov 24 Javascript
深入浅析JavaScript中的Function类型
Jul 09 Javascript
angular过滤器实现排序功能
Jun 27 Javascript
vue复合组件实现注册表单功能
Nov 06 Javascript
vue拦截器实现统一token,并兼容IE9验证功能
Apr 26 Javascript
微信小程序自定义底部弹出框
Nov 16 Javascript
vue-simple-uploader上传成功之后的response获取代码
Sep 07 Javascript
jQuery实现单击弹出Div层窗口效果(可关闭可拖动)
Sep 19 #Javascript
JS+CSS实现简单滑动门(滑动菜单)效果
Sep 19 #Javascript
jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果
Sep 19 #Javascript
jQuery实现点击按钮弹出可关闭层的浮动层插件
Sep 19 #Javascript
JS基于myFocus库实现各种功能的tab选项卡切换效果
Sep 19 #Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
Sep 19 #Javascript
JS实现的不规则TAB选项卡效果代码
Sep 18 #Javascript
You might like
PHP 各种排序算法实现代码
2009/08/20 PHP
php7 安装yar 生成docker镜像
2017/05/09 PHP
浅谈php的TS和NTS的区别
2019/03/13 PHP
基于JQuery的动态删除Table表格的行和列的代码
2011/05/12 Javascript
一个JavaScript去除字符串末尾的空白实例代码
2014/09/22 Javascript
使用node.js 获取客户端信息代码分享
2014/11/26 Javascript
javascript抽象工厂模式详细说明
2014/12/16 Javascript
jquery实现鼠标滑过后动态图片提示效果实例
2015/08/10 Javascript
JS实现的仿东京商城菜单、仿Win右键菜单及仿淘宝TAB特效合集
2015/09/28 Javascript
jQuery实现的分子运动小球碰撞效果
2016/01/27 Javascript
详解JavaScript for循环中发送AJAX请求问题
2020/06/23 Javascript
Vuejs第七篇之Vuejs过渡动画案例全面解析
2016/09/05 Javascript
JQuery遍历元素的父辈和祖先的方法
2016/09/18 Javascript
JS控制页面跳转时未请求要跳转的地址怎么回事
2016/10/14 Javascript
javascript设计模式之Adapter模式【适配器模式】实现方法示例
2017/01/13 Javascript
原生js实现图片放大缩小计时器效果
2017/01/20 Javascript
利用javascript如何随机生成一定位数的密码
2017/09/22 Javascript
小程序实现分类页
2019/07/12 Javascript
一篇不错的Python入门教程
2007/02/08 Python
python抓取最新博客内容并生成Rss
2015/05/17 Python
布局和排版教程 纯css3实现图片三角形排列
2014/10/17 HTML / CSS
详解CSS3的图层阴影和文字阴影效果使用
2016/06/09 HTML / CSS
Lookfantastic法国官网:英国知名美妆购物网站
2017/10/28 全球购物
成教毕业生自我鉴定
2013/10/23 职场文书
业务主管岗位职责
2013/11/20 职场文书
银行职员思想汇报
2013/12/31 职场文书
小学数学课后反思
2014/04/23 职场文书
村居抓节水倡议书
2014/05/19 职场文书
小学生教师节演讲稿
2014/09/03 职场文书
领导班子四风对照检查材料范文
2014/09/27 职场文书
财产分割协议书范本
2014/11/03 职场文书
2015新生加入学生会自荐书
2015/03/24 职场文书
小兵张嘎观后感300字
2015/06/03 职场文书
2016校本研修培训心得体会
2016/01/08 职场文书
2016年党员创先争优承诺书
2016/03/25 职场文书
python_tkinter弹出对话框创建
2022/03/20 Python