在我們?nèi)粘I钪校?jīng)常會(huì)遇到需要分享鏈接的場(chǎng)景,如果這個(gè)鏈接非常長(zhǎng),復(fù)制起來會(huì)比較麻煩,同時(shí)也不太美觀。這時(shí)候,我們就可以使用 jQuery 插件 jquery.qrcode 來生成一個(gè)二維碼,方便用戶掃描訪問。
$('selector').qrcode({ text: "http://example.com/very-long-url-here", width: 200, height: 200 });
上面的代碼就是調(diào)用 qrcode 插件來生成二維碼的簡(jiǎn)單示例。其中,text
參數(shù)是需要生成二維碼的地址,width
和height
分別是二維碼的寬度和高度。我們可以根據(jù)具體的需求來設(shè)置這些參數(shù)。
當(dāng)我們使用上面的代碼生成二維碼后,該二維碼會(huì)被插入到頁面中的指定元素中。我們可以通過 CSS 來控制該元素的位置、樣式等。
#qrcode-container { display: inline-block; margin: 20px; } #qrcode-container img { max-width: 100%; }
上面的代碼就是一個(gè)簡(jiǎn)單的樣式示例,將二維碼容器設(shè)置為inline-block
顯示,同時(shí)給二維碼圖片設(shè)置最大寬度為 100%。
總的來說,jquery.qrcode 插件可以讓我們方便地生成二維碼,讓長(zhǎng)地址變得更加美觀、易于分享。