使用JavaScript生成二維碼教程-附qrcodejs中文文檔

oneasp 發(fā)布于2019-08-21 17:45 / 3521人閱讀

摘要：使用生成二維碼依賴(lài)需要使用到的庫(kù)至此一個(gè)簡(jiǎn)單的二維碼就生成了接下來(lái)我們就詳細(xì)了解一下這個(gè)庫(kù)到底為我們提供了哪些參數(shù)配置和方法配置名稱(chēng)默認(rèn)值類(lèi)型說(shuō)明顯示二維碼的元素或該元素的參數(shù)配置名稱(chēng)默認(rèn)值類(lèi)型說(shuō)明需要生成的二維碼內(nèi)容圖像寬度圖像高度前

使用javascript生成二維碼 依賴(lài)jquery

需要使用到的庫(kù)

https://github.com/davidshimj...

DIV

javascript

 var qrcode = new QRCode("qrcode");
 
  qrcode.makeCode("http://www.fengkaichang.com");

至此一個(gè)簡(jiǎn)單的二維碼就生成了

接下來(lái)我們就詳細(xì)了解一下這個(gè)庫(kù)到底為我們提供了哪些參數(shù)配置和方法

配置

new  QRCode(element,option)

名稱(chēng)	默認(rèn)值	類(lèi)型	說(shuō)明
element	-	string	顯示二維碼的元素或該元素的 ID
option		objec	參數(shù)配置

名稱(chēng)	默認(rèn)值	類(lèi)型	說(shuō)明
text	-	string	需要生成的二維碼內(nèi)容
width	256	number	圖像寬度
height	256	number	圖像高度
colorDark	"#000000"	string	前景色
colorLight	"#ffffff"	string	背景色
correctLevel	QRCode.CorrectLevel.L		容錯(cuò)級(jí)別

容錯(cuò)級(jí)別有

QRCode.CorrectLevel.L
QRCode.CorrectLevel.M
QRCode.CorrectLevel.Q
QRCode.CorrectLevel.H

var qrcode = new  QRCode(element), {
    text: "www,fengkaichang.com",
    width: 150,
    height: 150,
    colorDark : "#000000",
    colorLight : "#ffffff",
    typeNumber:4,
    correctLevel : QRCode.CorrectLevel.H
});

API方法

qrcode.makeCode(text)    //設(shè)置二維碼內(nèi)容
qrcode.clear() //清除二維碼。

相關(guān)信息 GitHub 中文文檔

更多內(nèi)容請(qǐng)?jiān)L問(wèn)我的個(gè)人博客www.fengkaichang.com

云服務(wù)器 GPU云服務(wù)器教程文檔javascript javascript文檔教程 javascript教程文檔 javascript中文教程

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/89964.html

相關(guān)文章

vue 2.x項(xiàng)目 vue-qriously 生成二維碼并下載、cliploard復(fù)制粘貼

摘要：近日，重構(gòu)項(xiàng)目某一老模塊時(shí)，有一個(gè)功能是生成二維碼并下載，還可以復(fù)制鏈接。先想著新模塊中是否有生成二維碼的插件，看了下。項(xiàng)目中封裝了一個(gè)指令。一份用來(lái)顯示的。順帶說(shuō)一下，復(fù)制粘貼復(fù)制粘貼老模塊中是用的倉(cāng)庫(kù)。近日，重構(gòu)項(xiàng)目某一老模塊時(shí)，有一個(gè)功能是生成二維碼并下載，還可以復(fù)制鏈接。列表每項(xiàng)都有二維碼、下載二維碼和復(fù)制鏈接和列表上方總的二維碼。老模塊是用的qrocode中文文檔，qrco...

littlelightss 2019-08-22 17:16 評(píng)論0 收藏0
使用 qrcodejs 生成二維碼的幾個(gè)問(wèn)題

摘要：在這里的用法如下微信中多個(gè)二維碼在一起識(shí)別錯(cuò)誤這個(gè)問(wèn)題，我也遇到了，根據(jù)網(wǎng)友的提示，微信是截屏識(shí)別的，所以會(huì)出現(xiàn)這種問(wèn)題。示例代碼這里代碼跟前面脫節(jié)了，是另外的結(jié)構(gòu)，僅作為示例代碼是類(lèi)似的一些的匯總對(duì)象微信中有兩個(gè)挨著二維碼長(zhǎng)按識(shí)別的問(wèn)題博客地址 Preface 產(chǎn)品希望我這邊下載頁(yè)面加個(gè)二維碼，可以?huà)呙柘螺d APP，并且希望二維碼中有公司的 logo，很合理的需求，不過(guò)實(shí)現(xiàn)的時(shí)候依...

Lyux 2019-08-23 13:39 評(píng)論0 收藏0
分享AI有道干貨 | 126 篇 AI 原創(chuàng)文章精選（ML、DL、資源、教程）

摘要：值得一提的是每篇文章都是我用心整理的，編者一貫堅(jiān)持使用通俗形象的語(yǔ)言給我的讀者朋友們講解機(jī)器學(xué)習(xí)深度學(xué)習(xí)的各個(gè)知識(shí)點(diǎn)。今天，紅色石頭特此將以前所有的原創(chuàng)文章整理出來(lái)，組成一個(gè)比較合理完整的機(jī)器學(xué)習(xí)深度學(xué)習(xí)的學(xué)習(xí)路線(xiàn)圖，希望能夠幫助到大家。一年多來(lái)，公眾號(hào)【AI有道】已經(jīng)發(fā)布了 140+ 的原創(chuàng)文章了。內(nèi)容涉及林軒田機(jī)器學(xué)習(xí)課程筆記、吳恩達(dá) deeplearning.ai 課程筆記、機(jī)...

jimhs 2019-06-26 18:57 評(píng)論0 收藏0
關(guān)于 webpack 你可能忽略的細(xì)節(jié)（附源碼分析）

摘要：本篇的主要目標(biāo)是通過(guò)實(shí)際問(wèn)題來(lái)介紹中容易被人忽略的細(xì)節(jié)以及源碼分析以最新發(fā)布的版本的源碼為例并且提供幾種解決方案。探究原因及源碼分析這里以最新發(fā)布的版本的源碼作為分析。解決方案加參數(shù)基于上面簡(jiǎn)要的分析，我們來(lái)嘗試下參數(shù)的作用。注：本篇不是入門(mén)教程，入門(mén)請(qǐng)直接查看官方文檔。本篇的主要目標(biāo)是通過(guò)實(shí)際問(wèn)題來(lái)介紹 webpack 中容易被人忽略的細(xì)節(jié), 以及源碼分析(以最新發(fā)布的 relea...

mtunique 2019-08-21 11:23 評(píng)論0 收藏0
優(yōu)秀文章收藏（慢慢消化）持續(xù)更新~

摘要：整理收藏一些優(yōu)秀的文章及大佬博客留著慢慢學(xué)習(xí)原文協(xié)作規(guī)范中文技術(shù)文檔協(xié)作規(guī)范阮一峰編程風(fēng)格凹凸實(shí)驗(yàn)室前端代碼規(guī)范風(fēng)格指南這一次，徹底弄懂執(zhí)行機(jī)制一次弄懂徹底解決此類(lèi)面試問(wèn)題瀏覽器與的事件循環(huán)有何區(qū)別筆試題事件循環(huán)機(jī)制異步編程理解的異步 better-learning 整理收藏一些優(yōu)秀的文章及大佬博客留著慢慢學(xué)習(xí) 原文:https://www.ahwgs.cn/youxiuwenzhan...

JeOam 2019-08-23 18:24 評(píng)論0 收藏0