利用JavaScript生成二維碼而且中間有logo

時間 2019-12-01

標籤利用 javascript 生成二維而且中間 logo 欄目 JavaScript 简体版

原文原文鏈接

親測有效 javascript

須要的js文件有 jquery.qrcode.js 和 utf.js 以及 jquery-1.8.0.js 。還有一個 LOGO圖片可點擊下載文件。html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>該二維碼支持中文和LOGO</title>
 
<script type="text/javascript" src="jquery-1.8.0.js"></script>
<script type="text/javascript" src="utf.js"></script>
<script type="text/javascript" src="jquery.qrcode.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#qrcodeCanvas").qrcode({
            render : "canvas",    //設置渲染方式，有table和canvas，使用canvas方式渲染性能相對來講比較好
            text : "<span style="font-family: Consolas, 'Courier New', Courier, mono, serif; line-height: 18px;">http://www.baidu.com</span>",    //掃描二維碼後顯示的內容,能夠直接填一個網址，掃描二維碼後自動跳向該連接
            width : "200",               //二維碼的寬度
            height : "200",              //二維碼的高度
            background : "#ffffff",       //二維碼的後景色
            foreground : "#000000",        //二維碼的前景色
            src: 'photo.jpg'             //二維碼中間的圖片
        });
    });
</script>
 
</head>
<body>
    <center>
      <h2>該二維碼支持中文和LOGO</h2>
      <div id="qrcodeCanvas"></div>
    </center>
</body>
</html>

2、源碼下載java

相關標籤/搜索