<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>生成二维码</title><script src="https://cdn.jsdelivr.net/npm/qrcode/build/qrcode.min.js"></script><style>#qrcode {margin-top: 20px;}</style>
</head>
<body><h1>生成网页链接二维码</h1><input type="text" id="urlInput" placeholder="输入网页链接" value="https://www.example.com" /><button onclick="generateQRCode()">生成二维码</button><div id="qrcode"></div><script>function generateQRCode() {const url = document.getElementById('urlInput').value;const qrcodeDiv = document.getElementById('qrcode');// 清空之前的二维码qrcodeDiv.innerHTML = '';// 生成二维码QRCode.toDataURL(url, { width: 200, height: 200 }, (err, url) => {if (err) {console.error('生成二维码失败', err);return;}// 将二维码图片显示在页面上const img = document.createElement('img');img.src = url;qrcodeDiv.appendChild(img);});}// 页面加载时默认生成二维码window.onload = generateQRCode;</script>
</body>
</html>
