二維碼由jquery.qrcode.min.js將json字符串轉(zhuǎn)換而成，細(xì)節(jié)不再贅述，效果如圖：

調(diào)用瀏覽器打印功能（window.print()）時(shí)，會(huì)連同底層父頁面中的活動(dòng)列表一起疊加打印，效果很糟糕。

在網(wǎng)上搜了一些方法，做法是獲取二維碼dom元素賦值給整個(gè)dom的body，然后再調(diào)用瀏覽器的打印功能，缺點(diǎn)是會(huì)改變整個(gè)頁面，需要刷新恢復(fù)。但問題還不止于此，由于二維碼是在線生成的，獲取到的二維碼dom元素沒有實(shí)際內(nèi)容，所以這個(gè)方法不可行。

最終的解決辦法如下：
底層父頁面定義樣式

<style>@media print {.noprint {display: none;}} </style>

在底層父頁面的最外層元素標(biāo)簽中添加該樣式，同樣，modal框中的打印和關(guān)閉按鈕也加上這個(gè)樣式，直接調(diào)用瀏覽器打印功能就可以了，效果如圖：

與50位技術(shù)專家面對(duì)面20年技術(shù)見證，附贈(zèng)技術(shù)全景圖

總結(jié)

以上是生活随笔為你收集整理的打印modal框中在线生成的二维码的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。