成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

為博客的文章添加二維碼

王巖威 / 2981人閱讀

摘要：文章地址為博客的文章添加了一個生成二維碼的功能，可以在掃描二維碼后在移動端進行閱讀，還能分享給朋友或者分享到朋友圈。

文章地址：http://www.xiabingbao.com/blogs/2016/08/31/blogs-qrcode.html

為博客的文章添加了一個生成二維碼的功能，可以在掃描二維碼后在移動端進行閱讀，還能分享給朋友或者分享到朋友圈。只在文章的頁面才有生成二維碼的功能，首頁及其他頁面是沒有的。

具體的步驟是：

在文章頁面添加一個“生成二維碼”的點擊按鈕

用戶點擊按鈕后，請求生成二維碼的js

請求完畢后，生成二維碼并添加到頁面中

用戶再次點擊按鈕時，只是切換二維碼的顯示與隱藏

本博客采用jquery.code.min.js生成二維碼，使用方法也非常的簡單。首先引入jQuery和jquery.code.min.js，然后在頁面中準(zhǔn)備一個元素（如

），用來存放二維碼。

$("#qrcode").qrcode({
    render : "canvas",  // 采用canvas或table的方式生成，默認canvas
    width : 176,    // 默認256
    height: 176,    // 默認256
    text : "this is text"  // 內(nèi)容
})

如果其他的參數(shù)都不需要，只要內(nèi)容即生成二維碼，還可以：

$("#qrcode").qrcode("this is text")

具體的代碼如下：

$(".bcontent").append("");
$(".bcontent").on("click", ".qrcode a", function(){
    var $tsp = $(this).next();

    if( $tsp.find("canvas").length ){
        if( $tsp.css("display")=="block" ){
            $tsp.hide();
        }else{
            $tsp.show();
        }
    }else{
        if( self.showing ){
            return;
        }
        self.showing = true;
        $tsp.show().html( "正在生成中..." );
        $.ajax({
            url : "jquery.qrcode.min.js",
            dataType : "script",
            type : "get"
        }).done(function(){
            self.showing = false;
            $tsp.html("");
            $tsp.qrcode({
                render : "canvas",
                width : 176,
                height: 176,
                text : window.location.href
            });
        })
    }
})

文章地址：http://www.xiabingbao.com/blogs/2016/08/31/blogs-qrcode.html

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/80695.html

相關(guān)文章

  • 手把手教你使用Hexo + Github Pages搭建個人獨立博客

    摘要：設(shè)置什么是本用于介紹托管在的項目，不過，由于他的空間免費穩(wěn)定，用來做搭建一個博客再好不過了。你可以通過來訪問你的個人主頁。執(zhí)行過程中可能需要讓你輸入賬戶的用戶名及密碼，按照提示操作即可。推薦使用騰訊公益。 系統(tǒng)環(huán)境配置 要使用Hexo，需要在你的系統(tǒng)中支持Nodejs以及Git，如果還沒有，那就開始安裝吧！ 安裝Node.js 下載Node.js參考地址：安裝Node.js 安裝Git...

    劉福 評論0 收藏0

  • Django 學(xué)習(xí)小組：博客開發(fā)實戰(zhàn)第二周教程 —— 實現(xiàn)博客詳情頁面和分類頁面

    摘要：本節(jié)接上周的文檔學(xué)習(xí)小組博客開發(fā)實戰(zhàn)第一周教程編寫博客的首頁面，我們繼續(xù)給博客添加功能，以及改善前面不合理的部分。返回該視圖要顯示的對象。目前小組正在完成第一個項目，本文即是該項目第二周的相關(guān)文檔。 本教程內(nèi)容已過時，更新版教程請訪問： django 博客開發(fā)入門教程。 上周我們完成了博客的 Model 部分，以及 Blog 的首頁視圖 IndexView。 本節(jié)接上周的文檔 Djan...

    ingood 評論0 收藏0

  • 個人博客全新UI：我心中你最美

    摘要：那個月就是對著和的文檔寫出來了網(wǎng)站的前后端，也是第一次買服務(wù)器備案網(wǎng)站做反向代理讀文檔學(xué)做，懷念那些時光，讓現(xiàn)在的網(wǎng)站有了基礎(chǔ)。因此，管理系統(tǒng)聽歌臺被抽離成了單獨的應(yīng)用，后臺利用做反向代理，用二級域名記性訪問。 不知道你是否也有想過完全用自己的代碼實現(xiàn)自己的個人博客？定制專屬 UI、定制專屬邏輯、在信息爆炸的時代真正地沉淀下屬于自己的東西。我也曾經(jīng)歷了同樣的糾結(jié)，最終下定決心做了自己的...

    oliverhuang 評論0 收藏0

  • 用小程序·云開發(fā)打造功能全面的博客小程序丨實戰(zhàn)

    摘要：用小程序云開發(fā)將博客小程序常用功能一網(wǎng)打盡本文介紹博客小程序的詳情頁的功能按鈕如何實現(xiàn)，具體包括評論點贊收藏和海報功能，這里記錄下整個實現(xiàn)過程和實際編碼中的一些坑?？紤]到小程序本身的大小限制，使用的方式是最佳的。 用小程序·云開發(fā)將博客小程序常用功能一網(wǎng)打盡 本文介紹mini博客小程序的詳情頁的功能按鈕如何實現(xiàn)，具體包括評論、點贊、收藏和海報功能，這里記錄下整個實現(xiàn)過程和實際編碼中的一...

    cc17 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<