? ? ? ?之前接觸了一個二手房交易軟件,移動端使用H5開發(fā),需求中尤一快就會客戶通過手機可以直接簽訂租/售合同。
下面分享一下電子簽名的幾個步驟:
1、電子合同生成圖片(demo)

2、尋找可是的簽名插件(本文使用signature_pad.js)
????引入相關js
????<script charset="utf-8"src="js/jquery.min.js"></script>
????<script src="js/signature_pad.js"></script>
3、計算簽名生成位置
? ? 根據(jù)需要簽名的位置計算簽名生成的位置
4、js畫圖
創(chuàng)建canvas對象,將尺寸設置與電子檔合同一樣大,在新建的canvas里面重新繪制電子合同,在按照之前計算的簽名位置,將生成的簽名繪制在對應位置

注意事項:
簽名圖片沒有加載完成時直接調(diào)用繪圖會造成簽名無法顯示,所以需要對簽名圖片的onload方法里面在執(zhí)行繪圖操作