生成二维码代码

最新推荐文章于 2024-05-01 02:25:29 发布

Dj_Fairy

最新推荐文章于 2024-05-01 02:25:29 发布

阅读量1.7k

点赞数 1

分类专栏： jquery 文章标签：二维码 jquery

本文链接：https://blog.csdn.net/Dj_Fairy/article/details/78676286

版权

jquery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1、下载jquery.qrcode.min.js（地址）
2、代码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>生成二维码</title>
    <script src="jquery-3.2.1.min.js"></script>
    <script src="jquery.qrcode.min.js"></script>
    <style type="text/css">
     #d{
            position:relative;
        }
        .tip{
            color:#bfbfbf;
        }
       img#send{
           position:absolute; left:311px;z-index:1;
        }
        input#getval{
            padding-right: 20px;
        }
    </style>
</head>
<body>
<div id="d">
    <input  type="text" id="getval" placeholder="例如：http://www.baidu.com" style="float:left;width:300px"/>
    <img src="二维码.png" id="send" /><br>
    <div class="tip">输入地址后，点击按钮自动生成二维码</div>
    <div id="code" style="margin:auto; position:relative;"></div>
</div>
<script>
    $(document).ready(function(){
        $('#send').click(function(){
            $('#code').html("");
            $('#code').qrcode({
                render:"canvas",
                width:120,
                height:120,
                correctLevel:0,
                text:$('#getval').val()

            });
        });
    });
</script>
</body>
</html>

3、实现效果
这里写图片描述

Dj_Fairy

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
生成二维码代码

1、下载jquery.qrcode.min.js（地址） 2、代码<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>生成二维码</title> <script src="jquery-3.2.1.min.js"></script> <script src="jquery.qrc
复制链接

扫一扫