web页面-电子签名

youqitt

于 2020-08-13 11:37:33 发布

阅读量2k

点赞数

分类专栏：前端知识文章标签： javascript

本文链接：https://blog.youkuaiyun.com/weixin_41195867/article/details/107613060

版权

这篇博客探讨了如何在HTML页面中结合AngularJS框架，利用JavaScript技术实现电子签名的功能。通过创建交互式的签名画板，用户可以使用鼠标或触摸设备进行签名，最终保存并处理签名数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html

<canvas id="canvas" style="border:none ;"></canvas>

 <div class="clearBtn" ng-click="clearDrew()">重新签名</div>
<div class="saveBtn" ng-click="saveDrew()">确认签订</div>

angularjs 框架 - js

var lastX, lastY;
 var canvasW = document.body.clientWidth - 70;
 console.log(document.body.clientWidth)
 var ctx = document.getElementById("canvas").getContext("2d");
 var c = document.getElementById("canvas");

 $scope.hasTips = true;
 $scope.$on('$ionicView.afterEnter', function () {
     //进入页面执行
     InitThis();
     $scope.clearDrew();
     drawTips(true);
 }, false);
 var barHeight = 44; //biao
 //显示or清空 '最佳书写区'
 function drawTips(flag) {
   
     if (flag) {
   
         ctx.fillStyle

最低0.47元/天解锁文章