|
<!DOCTYPE html>
<html>
?? ?<head>
?? ??? ?<meta charset="utf-8">
?? ??? ?<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
?? ??? ?<meta name="format-detection" content="telephone=no">
?? ??? ?<title> </title>
?? ??? ?<meta name="apple-mobile-web-app-capable" content="yes">
?? ??? ?<meta name="apple-mobile-web-app-status-bar-style" content="black">
?? ??? ?<link rel="stylesheet" href="css/mui.min.css">
?? ??? ?<style>
?? ??? ??? ?.code{
?? ??? ??? ??? ?margin-top: 50px;
?? ??? ??? ??? ?margin-left: 50px;
?? ??? ??? ??? ?width: 200px;
?? ??? ??? ??? ?height: 200px;
?? ??? ??? ??? ?text-align: center;
?? ??? ??? ?}
?? ??? ?</style>
?? ?<script type="text/javascript" src="//cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="//static.runoob.com/assets/qrcode/qrcode.min.js"></script>
?? ??? ?<script src="js/mui.min.js"></script>?? ?
?? ??? ?
?? ?</head>
?? ?
?? ?<body>
?? ??? ?<header class="mui-bar mui-bar-nav">
?? ??? ??? ?<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
?? ??? ??? ?<h1 class="mui-title"> </h1>
?? ??? ?</header>
?? ??? ?<div class="mui-content">
?? ??? ?
?? ??? ??? ?<input type="text" name="" id="text" value="" placeholder="http://www.baidu.com" />
?? ??? ??? ?<div class="code" id="qrcode">?
?? ??? ??? ?
?? ??? ??? ?</div>
?? ??? ??? ?<button class="mui-btn-block" id="Dic">点击生成二维码</button>
?? ??? ?<div>
?? ?
?? ??? ?<script>
?? ?var qrcode = new QRCode(document.getElementById("qrcode"), {
?? ??? ? ? ?text: "http://www.runoob.com",
?? ??? ? ? ?width: 128,
?? ??? ? ? ?height: 128,
?? ??? ? ? ?colorDark : "#000000",
?? ??? ? ? ?colorLight : "#ffffff",
?? ??? ? ? ?correctLevel : QRCode.CorrectLevel.H
?? ?});
?? ?function makeCode () {
?? ??? ?var elText = document.getElementById("text").value;
?? ??? ?console.log(elText);
?? ??? ?qrcode.makeCode(elText);
?? ?}
?? ?
?? ?document.getElementById('Dic').addEventListener('tap',function () {
?? ? ? ? ? ?makeCode();
?? ? ? ? ? ?
?? ?})
?? ?
?? ??? ?</script>
?? ?</body>
</html>
|