700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 微信公众号页面调用微信扫一扫

微信公众号页面调用微信扫一扫

时间:2022-07-15 01:39:18

相关推荐

微信公众号页面调用微信扫一扫

本以为调用微信扫一扫很容易,结果看了微信的开发者文档,正如大家所说,微信的开发文档写的一塌糊涂,非常的不详细。

转载:/article/42734

从而导致基于微信的好多开发都比较不是很方便,今天我们在公众号的个页面需要使用微信扫一扫撒,扫条形码,然后获取条形码数据,再生成二维码,再识别二维码进行付款。如果是自己写调用微信扫一扫,需要前后端结合才可以,尤其是签名,时间戳等动态获取的值,但是后来有一位大佬分享的代码,简单粗暴一共几行,就可调用微信扫一扫。

获取条形码数据并赋值到输入框

上代码:

<!DOCTYPE html><html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> <title></title><script type="text/javascript" src="js/jquery-1.8.3.min.js"></script><script type="text/javascript" src="js/jquery.qrcode.min.js"></script><script src="http://res./open/js/jweixin-1.2.0.js"></script><style>body{/*text-align:center*/} .container{margin: 0 auto;padding: 25px 0 0 0 ;position: relative;}#scanBtn{display: inline-block;width: 60px;height: 60px; top: 23px;/*margin-left: 15px;*/position:absolute;background-image: url(img/aaronS.png) ;background-size:50% 50% ;background-repeat:no-repeat ;background-position-x:center ;background-position-y:center ;}#DeliveryID{width:200px;height:40px;border-radius:10px;padding-left: 10px;font-size: 1rem;vertical-align: middle;}.coders{text-align:center;}#CodeBut{-webkit-appearance:none;margin-top: 40px;height: 60px;width: 300px;color:white;border-width: 0;background-color: rgba(234,85,4,1); font-size: 2rem;border-radius:10px;}#CodeImg{text-align:center;margin-top: 150px;}#name{-webkit-appearance:none;width:100px;height:60px;color:white;background-color: rgba(234,85,4,1); -webkit-background-color: rgba(234,85,4,1); border-width: 0;border-radius:10px;font-size:20px;vertical-align: middle;}canvas{display: none;}input {width: 80%;border: 1px solid #ccc;padding: 11px 15px;border-radius: 3px;padding-left: 5px;-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s}input:focus {border-color: #66afe9;outline: 0;-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {-webkit-appearance: none;appearance: none;margin: 0;}</style><script type="text/javascript">$(document).ready(function () {if (location.href.indexOf("qrresult=")>-1){var listContent = location.href.split("qrresult=")[1]; //获取扫中以后的内容var listContents = listContent.slice(9);//由于生成的字符串前9位是没用,直截取有用的数字内容 $("#DeliveryID").val(listContents);}});</script></head><body><div><div class="container"><input id="DeliveryID" type="number" placeholder="请输入交货单号" name="" value="" /><div id="scanBtn"></div><!--对,就是下面这一句,大佬提供的,且必须要a标签--><a id="scanBtn" href="/w/api/saoyisao?redirect_uri=你使用扫一扫当前页面的服务器地址,https开头的"></a></div></body></html>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。