代碼掃碼登錄是現(xiàn)在很流行的一種登錄方式，它可以讓用戶更加便捷快速地登陸網(wǎng)站。下面我們就來(lái)看看html怎么實(shí)現(xiàn)代碼掃碼登錄。

<div id="login">
<div id="qrcode"></div>
<div id="loginForm">
<form action="" method="post">
<input type="text" placeholder="請(qǐng)輸入用戶名或郵箱" />
<input type="password" placeholder="請(qǐng)輸入密碼" />
<input type="submit" value="登錄" />
</form>
</div>
</div>
<script>
var qrcode = new QRCode(document.getElementById("qrcode"), {
width : 200,
height : 200
});
function makeQRCode(text) {
qrcode.makeCode(text);
}
makeQRCode("http://example.com/login.html");
setInterval(function() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var response = JSON.parse(xhr.responseText);
if (response.status == "succeeded") {
alert("登錄成功");
}
}
};
xhr.open("GET", "http://example.com/qrcode/login_status.json", true);
xhr.send();
}, 1000);
</script>

首先，在html中我們需要建立一個(gè)id為login的大框架，其中包含兩個(gè)id為qrcode和loginForm的子框架。qrcode框架就是用來(lái)存放二維碼的，而loginForm框架就是用來(lái)存放表單，讓用戶在掃碼登錄失敗的時(shí)候可以通過(guò)表單手動(dòng)登錄。

然后，在