js基于qrcode.js生成二維碼的方法【附demo插件源碼下載】

更新時(shí)間：2016年12月28日 11:22:49 作者：yi-sheng

這篇文章主要介紹了js基于qrcode.js生成二維碼的方法,結(jié)合實(shí)例形式分析了基于qrcode.js文件生成二維碼的具體實(shí)現(xiàn)技巧,需要的朋友可以參考下

本文實(shí)例講述了js基于qrcode.js生成二維碼的方法。分享給大家供大家參考，具體如下：

調(diào)用qrcode.js文件代碼：

<!DOCTYPE html>
<html>
<head>
 <title></title>
 <meta charset="utf-8"/>
 <script src="js/qrcode.js"></script>
 <style>
 #qrcode{
  /*text-align: center;*/
  /*display: table-cell;*/
  /*width: 96px;*/
  /*height: 96px;*/
  /*vertical-align:middle;*/
  /*position: relative;*/
 }
 </style>
</head>
<body>
<div id="qrcode">
</div>
<input type="text" id="getval"/> <button id="send">點(diǎn)擊更換驗(yàn)證碼</button>
<script>
 window.onload =function(){
 var qrcode = new QRCode(document.getElementById("qrcode"), {
  width : 96,//設(shè)置寬高
  height : 96
 });
 qrcode.makeCode("http://www.dhdzp.com");
 document.getElementById("send").onclick =function(){
  qrcode.makeCode(document.getElementById("getval").value);
 }
 }
</script>
</body>
</html>

其中調(diào)用方法：

var qrcode = new QRCode(elem, {
 width : 96,//設(shè)置寬高
 height : 96
});
qrcode.makeCode("http://www.dhdzp.com");

附：

qrcode.js可點(diǎn)擊此處本站下載。

這里再提供jquery.qrcode.min.js本站下載地址。

PS：這里再為大家推薦兩款二維碼在線生成工具，免費(fèi)供大家使用：

二維碼在線生成工具(基礎(chǔ)版)：
http://tools.jb51.net/transcoding/qrcode

在線生成二維碼工具(加強(qiáng)版)：
http://tools.jb51.net/transcoding/jb51qrcode

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript圖片操作技巧大全》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

10個(gè)php函數(shù)實(shí)用卻不常見
函數(shù)是PHP如此強(qiáng)大的源泉，但是很多PHP函數(shù)并沒有得到充分的利用。這里，我們給大家簡(jiǎn)單介紹10個(gè)不常見，但非常有用的函數(shù)。
2015-10-10
PHP中利用substr_replace將指定兩位置之間的字符替換為*號(hào)
PHP的substr_replace將指定兩位置之間的字符替換為*號(hào)的代碼，需要的朋友可以參考下。
2011-01-01
PHP基于關(guān)聯(lián)數(shù)組20行代碼搞定約瑟夫問題示例
這篇文章主要介紹了PHP基于關(guān)聯(lián)數(shù)組20行代碼搞定約瑟夫問題,結(jié)合具體實(shí)例分析了php使用關(guān)聯(lián)數(shù)組解決約瑟夫問題的相關(guān)操作技巧,需要的朋友可以參考下
2017-11-11
使PHP自定義函數(shù)返回多個(gè)值
使PHP自定義函數(shù)返回多個(gè)值...
2006-11-11
PHP實(shí)現(xiàn)的簡(jiǎn)單四則運(yùn)算計(jì)算器功能示例
這篇文章主要介紹了PHP實(shí)現(xiàn)的簡(jiǎn)單四則運(yùn)算計(jì)算器功能,結(jié)合實(shí)例形式分析了PHP基于堆棧實(shí)現(xiàn)的表達(dá)式運(yùn)算功能,需要的朋友可以參考下
2017-12-12
PHP檢測(cè)用戶語言的方法
這篇文章主要介紹了PHP檢測(cè)用戶語言的方法,涉及針對(duì)php預(yù)定義服務(wù)器變量$_SERVER['HTTP_ACCEPT_LANGUAGE']的判定與使用技巧,需要的朋友可以參考下
2015-06-06
php mysqli查詢語句返回值類型實(shí)例分析
這篇文章主要介紹了php mysqli查詢語句返回值類型,結(jié)合實(shí)例形式分析了php+mysqli常用的查詢、插入語句的使用與返回值類型,需要的朋友可以參考下
2016-06-06
phpStudy在運(yùn)行PHP文件時(shí)出現(xiàn)中文亂碼的有效解決方法
在使用phpStudy進(jìn)行PHP開發(fā)時(shí),經(jīng)常會(huì)遇到中文顯示亂碼的問題,這不僅影響開發(fā)效率,還可能導(dǎo)致網(wǎng)站顯示異常,本文將詳細(xì)介紹解決phpStudy中文亂碼的有效方法,需要的朋友可以參考下
2024-10-10
基于PHP CURL用法的深入分析
本篇文章是對(duì)PHP中的CURL用法進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下
2013-06-06
解決laravel 出現(xiàn)ajax請(qǐng)求419(unknown status)的問題
今天小編就為大家分享一篇解決laravel 出現(xiàn)ajax請(qǐng)求419(unknown status)的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2019-09-09