• 技术文章 >web前端 >js教程

    JS实现将链接生成二维码并转为图片的方法

    亚连亚连2018-05-29 16:31:04原创1631
    这篇文章主要介绍了JS实现将链接生成二维码并转为图片的方法,涉及qrcodejs插件及js图片生成相关操作技巧,需要的朋友可以参考下

    本文实例讲述了JS实现将链接生成二维码并转为图片的方法。分享给大家供大家参考,具体如下:

    <p id="code"></p>
    <img id="img"/>
    <script type="text/javascript">
      var qrcode=$("#code").qrcode({
        render:'canvas||table',
        width: 200, //宽度
        height:200, //高度
        text: "http://www.baidu.com" //任意内容
      }).hide();
      var canvas=qrcode.find('canvas').get(0);
      //如果有循环,此句必不可少 qrcode.find('canvas').remove();
      var data = canvas.toDataURL('image/jpg');
      $('#img').attr('src',data) ;
      saveFile(data,"fd范德萨范德萨");
      //转为图片的方法,需要上门的data
      function saveFile(data,filename){
        var save_link=document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
        save_link.href=data;
        save_link.download=filename;
        var event=document.createEvent('MouseEvents');
        event.initMouseEvent('click',true,false,window,0,0,0,0,0,false,false,false,false,0,null);
        save_link.dispatchEvent(event);
      };
    </script>

    上面是我整理给大家的,希望今后会对大家有帮助。

    相关文章:

    微信小程序之分享页面如何返回首页的示例

    详解VUE 对element-ui中的ElTableColumn扩展

    Vue 自定义动态组件实例详解

    以上就是JS实现将链接生成二维码并转为图片的方法的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:Vue实现动态创建和删除数据的方法 下一篇:基于vue1和vue2获取dom元素的方法
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• 18个常见angular面试题(附答案分析)• JavaScript的Symbol类型、隐藏属性及全局注册表详解• 什么是消息队列?node中如何使用消息队列?• 浅析IDEA中如何开发Angular• 整理总结JavaScript常见的BOM操作
    1/1

    PHP中文网