HTML支付方式动态选择(js源码)

Posted 2022-07-01 码城

简单说明

WEB页面，支付类型可以有很多，让用户选择其喜欢的支付方式，就需要提供选择入口，这里就提供源码，以供参考。

效果展示

 完整演示效果参见：

在线打赏 - 码到城攻免签工具实现网站自动发货，挂机运行，可靠稳定，一键打赏https://www.codecomeon.com/pay/support

部分源码

<div class="channel-list-wraper">
    <div class="channel-wraper first-channel active">
        <p class="name"><i class="alipay"></i>
            支付宝打赏
        </p>
    </div>
    <div class="channel-wraper">
        <p class="name"><i class="wechat"></i>
            微信打赏
        </p>
    </div>
</div>

当然，还可以自行扩展支付类型，只用给 `channel-list-wraper` 中追加子 `div` 即可。当你在用手机支付时，会出现一个默认的支付方式，如果你不同意这个支付方式，可以在右下角的选择其他支付方式，点开进入，会出现你所有可选择的支付方式，包括关联的信用卡，以及余额，余额宝，花呗等等。

完整源码

支付方式选择html源码 - 码到城攻WEB页面，支付类型可以有很多，让用户选择其喜欢的支付方式，就需要提供选择入口，这里就提供源码，以供参考https://www.codecomeon.com/posts/199/