jquery-qrcode是一款非常流行的二維碼生成插件,可以幫助開發者快速生成二維碼。不過,有一些開發者希望在二維碼中間加入一些文字,以便于更好地提示用戶對應的信息。這時候,可以使用jquery-qrcode中的一些參數來實現這個功能。
//先引入jquery和jquery-qrcode庫
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
//生成二維碼
$('#qrcode').qrcode({
text: 'http://www.baidu.com', //二維碼內容
width: 200, //二維碼寬度
height: 200, //二維碼高度
quiet: 2, //二維碼邊框寬度(單位為格)
mode: 4, //二維碼誤差矯正級別(0-3,0為最低級別,3為最高級別)
label: '百度搜索', //二維碼中間的文字
fontcolor: '#000000', //二維碼中間文字顏色
fontname: 'sans' //二維碼中間文字字體
});
在上面的代碼中,我們可以看到label、fontcolor和fontname這三個參數,分別代表二維碼中間的文字、文字顏色和文字字體。其中,label是必須要設置的參數,如果不設置,二維碼中間就不會顯示文字。
當然,要想在二維碼中間加入更加復雜的內容,比如圖片、動畫等,也是可以實現的,不過這就需要使用一些高級的技巧了。
上一篇Vue搖號項目
下一篇css 去除蘋果默認樣式