注册 登录 充值会员 退出
联系客服 毕业设计 java源码 PHP源码
充值

html5 canvas写字签名板代码

作者/代码整理:  (源码已亲测,不会安装的可以向QQ1915635791要安装视频教程) 发布日期:2022-12-31
html5 canvas写字签名板代码
html5 canvas写字签名板代码,可手动设置签名板的宽高(或旋转画布)后canvas之前绘制的内容会被清除掉。


js代码

   <script src="jquery-1.12.4.min.js"></script>
    <script src="dist/Tablet-1.0.min.js"></script>
    <script>
        var tablet;
        $(function (){
            tablet = new Tablet("#container",{
                defaultColor: "#2e76da",
                otherHtml: $("#temp").html(),
                onInit: function (){
                    var that = this,
                        container = this.container;
                    container.find("select").eq(0).on("change", function (){
                        that.setLineWidth($(this).val());
                    });
                    container.find("select").eq(1).on("change", function (){
                        that.rotate($(this).val());
                    });
                    container.find(".save-canvas-to-img").on("click", function (){
                        console.log(that.getBase64());
                        if(!that.isMobile){
                            alert("请按f12打开控制台查看base64图片数据!");
                        }
                    });
                    container.find(".get_blob").on("click", function (){
                        that.getBlob();
                    });
                    /*container.find(".download").on("click", function (){
                        document.getElementById("preview_img").src = that.getBase64();
                    });*/
                }
            });
            console.log(tablet);    
        });        
    </script>

关注公众号,免费赠送安装视频教程、环境和学习视频,后面会不断更新。