仅用HTML语言生成一个简单的二维码 [英] Generating a Simple QR-Code with just HTML
本文介绍了仅用HTML语言生成一个简单的二维码的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我遇到了这个APIserver来生成QRCode，但我想知道是否有可能只使用HTML来生成QRCode例如这就是我所想的
<input id="text" type="text" value="Please Enter Your NRIC or Work Permit" style="Width:20%"/>
<img src="https://api.qrserver.com/v1/create-qr-code/?data=HelloWorld&size=100x100" alt="" title="HELLO" />
在标题&我相信这是您将写入文本和二维码将生成的地方，我想知道如何创建一个文本框以便我可以直接在网站上输入值。
推荐答案
您想过这样的事情吗？https://jsfiddle.net/v7d6d1ps/
您的HTML可以类似于您已有的内容，但添加了onblur事件。只有HTML不能做到这一点，所以我添加了jQuery/JavaScript组合。
<html>
<head>
<title>Testing QR code</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
function generateBarCode()
{
var nric = $('#text').val();
var url = 'https://api.qrserver.com/v1/create-qr-code/?data=' + nric + '&size=50x50';
$('#barcode').attr('src', url);
}
</script>
</head>
<body>
<input id="text" type="text"
value="NRIC or Work Permit" style="Width:20%"
onblur='generateBarCode();' />
<img id='barcode'
src="https://api.qrserver.com/v1/create-qr-code/?data=HelloWorld&size=100x100"
alt=""
title="HELLO"
width="50"
height="50" />
</body>
</html>
这篇关于仅用HTML语言生成一个简单的二维码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
