在互联网日渐普及的今天,支付宝这种便利的网上交易平台越来越受人钟爱,我们很多时候都能用到。今天逸香阁就来告诉大家如何实现支付宝收款,可以卖模板,插件,也可以做为捐助等等。不废话了,看效果图如下
首先加入样式CSS代码,如下
<style>input{border:0px;height:25px;line-height:25px;} .alipay{margin:20px auto;width:300px;border:1px solid #ccc;font-size:12px;} .alipay ul{margin:0px;padding:0px;} .alipay li{list-style-type:none;clear:both; overflow:hidden;} .alipay li p{float:left;text-indent:0!important;padding:0px;margin:0px;width:60px;text-align:center;border-right:1px solid #ccc;} .alipay li span{margin-left:5px;} .bb{border-bottom:1px solid #ccc;height:30px;line-height:30px;} .paybg{background:#ddd;} .pay{text-align:center;}.pay input{background:#ccc;color:#FFF;height:30px;line-height:30px;border-radius:3px;margin:5px auto; font-weight:bold;} .pay input:hover{background:#FC3;} </style>
html代码如下(其中的支付宝帐号改为自己的即可):
<form name="alipayment" accept-charset="GBK" method="post" action="https://shenghuo.alipay.com/send/payment/fill.htm" target="_blank" onSubmit="return CheckForm();"> <div class="alipay"><ul> <li class="bb paybg"><p>付款帐号</p><span><input type="hidden" name="optEmail" value="支付宝帐号" />支付宝帐号</span></li> <li class="bb"><p>付款金额</p><span><input type="text" id="s" class="form-control" name="payAmount" value="" placeholder="金额必须填写"/></span></li> <li class="bb"><p>备注说明</p><span><input type="text" name="title" value="" placeholder="可以是邮箱或QQ..."/></span></li> <li class="pay"><input type="submit" id="searchsubmit" value="登录支付宝付款" /></li> </ul></div></form>
实现必填项则需要加入js代码,如下
<script language=JavaScript> function CheckForm(){ if(document.alipayment.payAmount.value.length == 0){alert("请输入付款金额.");document.alipayment.payAmount.focus();return false;} var reg = new RegExp(/^d*.?d{0,2}$/); if(! reg.test(document.alipayment.payAmount.value)){alert("金额必须是数字");document.alipayment.payAmount.focus();return false;} if(Number(document.alipayment.payAmount.value) < 1.00){alert("付款金额金额最小是1.00.");document.alipayment.payAmount.focus();return false; } } </script>