zoukankan      html  css  js  c++  java
  • jQuery二维码

    现在二维码很火,因为他可以很方便的贴到任何地方,只要扫一扫就可以看到二维码的内容

    ok

    废话少说,上代码

    这个二维码基于jquery和jquery.qrcode插件

    所以使用前先引入

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

      

    给一个github的地址,可以通过github下载demo:

    https://github.com/Lucasli2018/jquery-qrcode.git
    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<title></title>
    	</head>
    	<body>
    		<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
    		<script type="text/javascript" src="js/jquery.qrcode.js" ></script>
            <script type="text/javascript" src="js/qrcode.js" ></script> 
            <script type="text/javascript" src="js/utf.js" ></script>
    		 <p>Render in table</p>
    		 <div id="qrcodeTable"></div>
    		 <p>Render in canvas</p>
    		 <div id="qrcodeCanvas"></div>
    		 <script> 
    		    jQuery('#qrcodeTable').qrcode({
    		         render    : "table",                <!--二维码生成方式 -->
    		         text    : "http://www.baidu.com" , <!-- 二维码内容  -->
    		         width : "200",               //二维码的宽度
                     height : "200",
    		     });    
    		     jQuery('#qrcodeCanvas').qrcode({
    		     	 render    : "canvas",
    		         text    : "http://www.baidu.com",
    		         width : "200",               //二维码的宽度
                     height : "200",              //二维码的高度
                     background : "#ffffff",       //二维码的后景色
                     foreground : "#000000",        //二维码的前景色
                     src: 'img/gray.jpg'             //二维码中间的图片
    		     });    
    		 </script>
    		 </body>
    </html>
    

      

    效果:

  • 相关阅读:
    Pytorch中的torch.nn类
    form表单转化json对象
    js 算法
    vue 中ref 的使用注意事项
    url 地址含参数较多如何拼接
    关于jsonp知识的理解
    ztree 使用心得
    Git查看与修改用户名、邮箱(转载)
    vue2.0 keep-alive 最佳实战(转载)
    使用keep-alive 实现 页面回退不刷新内容
  • 原文地址:https://www.cnblogs.com/1906859953Lucas/p/9815476.html
Copyright © 2011-2022 走看看