js背景中添加二維碼代碼（js背景中添加二維碼代碼的方法）

• 1、網頁中圖片自動生成二維碼
• 2、如何使用js生成基於css的二維碼
• 3、html5+js實現二維碼掃描的代碼？
• 4、怎麼設置js生成二維碼掃描出來的內容
• 5、用js怎麼實現把一個鏈接變成二維碼
• 6、怎麼把js生成的二維碼放在img標籤裡面

網頁自動生成二維碼，原始生成二維碼圖片大小為寬度為150px，高度為150px。只需要在需要顯示地方放入二維碼JS代碼即可（滑鼠懸停圖片的時候顯示二維碼）

script type=”text/javascript”  

thisURL = document.URL;  

strwrite = 

 + thisURL + “‘ width=’150′ height=’150′ alt=’圖片地址URL二維碼生成’ /”; 

document.write( strwrite );  

/script

本二維碼生成使用是google谷歌JS，載入快速、兼容所有瀏覽器、兼容動態網頁、靜態html網頁。

二維碼是通過css的背景色填充的,如果是0填白色,1的話填黑色,每個二維碼分成好多tr行,每一行裡面根據0或1生成色塊,構成一張二維碼！

通過下面的代碼即可實現：

HBuilder就有調用原生硬體的介面html5++

!DOCTYPE html

html

head

meta charset=”utf-8″

titleCamera Example/title

script type=”text/javascript”

// 擴展API載入完畢後調用onPlusReady回調函數

document.addEventListener( “plusready”, onPlusReady, false );

var r = null;

// 擴展API載入完畢，現在可以正常調用擴展API

function onPlusReady() {

// 獲取設備默認的攝像頭對象

var cmr = plus.camera.getCamera();

1、代碼：代碼就是程序員用 開發工具所支持的語言寫出來的 源文件，是一組由 字元、符號或信號 碼元以離散形式表示信息的明確的規則體系。

2、html5：是指萬維網的核心語言、 標準通用標記語言下的一個應用 超文本標記語言（ HTML）的第五次重大修改。2014年10月29日， 萬維網聯盟宣布，經過接近8年的艱苦努力，該標準規範終於制定完成。

可以使用juqery的 qrcode來實現！

1， 引入 jquery 及其qrcode 插件js: jquery.js , jquery.qrcode.min.js

2 , 指定一個二維碼容量元素： div id=”qrcode”/div

3 , 在指定的容量元素中生成二維碼: jquery(‘#qrcode’).qrcode(“這裡是想要掃描後的獲得的地址”);

div id = “qrcodeid”/div //生成的二維碼放在此 div 中

script type=”text/javascript” src=”js/jquery.qrcode.min.js”/script//引入qrcode.js（到 下載 ）

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: \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

JS代碼如下：

script// ![CDATA[

thisURL = document.URL;

strwrite =

“img

src=’;chs=150x150choe=UTF-8chld=L|4chl=”

+ thisURL + “‘ width=’150′ height=’150′ alt=’網址URL 二維碼生成’ /”;

document.write( strwrite );

// ]]/script

使用方法簡單，直接複製上面代碼到需要在網頁顯示的位置就可以了。