Html jQuery微信支付宝网站文章打赏插件

想必很多个人博客或者自媒体网站的收入一般都是来至于广告、如果说有一个打赏功能的话也许会增加一小部分我们的收入、今天就分享一个jQuery文章页二维码扫码打赏功能的代码

当然这跟我自己博客打赏功能有点区别(PS：现已分享博客打赏插件、有需求有可以去看看)、今天分享的是一款点击打赏按钮、弹出二维码页面、微信与支付宝支付二维码扫描打赏的插件、适用于大部分网站、下面是效果图

Html代码

<div class="content">
<p><a href="javascript:void(0)" onclick="dashangToggle()" class="dashang" title="打赏，支持一下">打赏</a></p>
<div class="hide_box"></div>
<div class="shang_box">
    <a class="shang_close" href="javascript:void(0)" onclick="dashangToggle()" title="关闭"><img src="img/close.jpg" alt="取消" /></a>
    <div class="shang_tit">
        <p>感谢您的支持，我会继续努力的!</p>
    </div>
    <div class="shang_payimg">
        <img src="img/alipayimg.jpg" alt="扫码支持" title="扫一扫" />
    </div>
        <div class="pay_explain">扫码打赏，你说多少就多少</div>
    <div class="shang_payselect">
        <div class="pay_item checked" data-id="alipay">
            <span class="radiobox"></span>
            <span class="pay_logo"><img src="img/alipay.jpg" alt="支付宝" /></span>
        </div>
        <div class="pay_item" data-id="weipay">
            <span class="radiobox"></span>
            <span class="pay_logo"><img src="img/wechat.jpg" alt="微信" /></span>
        </div>
    </div>
    <div class="shang_info">
        <p>打开<span id="shang_pay_txt">支付宝</span>扫一扫，即可进行扫码打赏哦</p>
    </div>
</div>
</div>

jQuery代码

<script type="text/javascript">
$(function(){
    $(".pay_item").click(function(){
        $(this).addClass(´checked´).siblings(´.pay_item´).removeClass(´checked´);
        var dataid=$(this).attr(´data-id´);
        $(".shang_payimg img").attr("src","img/" dataid "img.jpg");
        $("#shang_pay_txt").text(dataid=="alipay"?"支付宝":"微信");
    });
});
function dashangToggle(){
    $(".hide_box").fadeToggle();
    $(".shang_box").fadeToggle();
}
</script>

jQuery 打赏插件源代码下载链接: 网页打赏功能 密码: x22p