使用 jq jSignature来实现h5页面签名效果

js yekong

html开发时,要求可以在页面中进行签名,这里我们使用jSignature.min来实现。
使用 jq jSignature来实现h5页面签名效果

html

<div class="canvas" id="signature"></div>

js

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        var param = {
            width: '100%',//签名区域的宽
            height: '240px',//签名区域的高
            cssclass: 'zx11',//画布的类 可以写自定义的样式
            UndoButton: false,//撤销按钮的状态 这个按钮的样式修改要去jSignature.js文件中去找
            signatureLine: true,//去除默认画布上那条横线
            lineWidth: '1' //画笔的大小
        };
        $("#signature").jSignature(param);
    });
    // document.getElementById("clear").addEventListener('tap', function () {
    //     $("#signature").jSignature("reset");
    //     $("#pic")[0].innerHTML = '';
    // });
    // document.getElementById("save").addEventListener('tap', function () {
    //     var datapair = $("#signature").jSignature("getData", "image");
    //     var array = datapair.splice(",");
    //     mui.toast(array[1]);
    // });

    // document.getElementById("export").addEventListener('click', function () {
    //
    // });
</script>

演示地址:

使用 jq jSignature来实现h5页面签名效果实例

喜欢