~~~
加載插件代碼后,handSign.showSignPage()可以喚醒簽字版,簽完字后可以獲取筆跡數據;
這個功能只能在手機瀏覽器才能正常運行;PC瀏覽器不能使用;
~~~
| options參數 | 說明 |
| --- | --- |
| width | 表單頁面的寬度 |
| height | 表單頁面的高度 |
| fixed |{x:0.1,y:0.1}; 筆跡固話到文件后,在頁面的位置 , x為占表單寬度的比值,y為占表單高度的比值 |
| signCallback | 簽字點確定后的回調,具體見下方 |
| signCallback參數 | 說明 |
| --- | --- |
| bethelNote | 第一個參數,獲取筆跡的數據 |
| base64Image | 第二個參數,獲取筆跡圖片的base64數據 |
[獲取筆跡數據和筆跡圖片demo](https://www.dandanqian.com/guotai/write/signdemo.html)
示例代碼
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="keywords" content="">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="x5-orientation" content="portrait">
<meta name="x5-fullscreen" content="true">
<meta name="full-screen" content="yes">
<meta name="format-detection" content="telephone=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<link href="../css/handSign.css?v=06121637" rel="stylesheet">
<script src="//pub.wellsign.cn/javascript/jquery.min.js"></script>
<script src="//pub.wellsign.cn/javascript/vue/vue.js"></script>
<script src="../js/readingv4_min.js"></script>
<script src="../js/handSign-min.js"></script>
</head>
<body>
<div id="WSSignPage"></div>
<div>
<input type="button" value="點擊簽名" onclick="handSign.showSignPage()" />
</div>
<div>
簽名處:
</div>
<img width="100" height="100" id='img' src=""/>
</body>
<script>
var options = {
width: 850,
height: 792,
fixed: {
x: 0.5,
y: 0.5
},
signCallback: function(bethelNote, base64Image) {
console.log(bethelNote);
var img = new Image();
$('#img').attr('src', base64Image);
},
}
var handSign = new handSign(options);
</script>
</html>
~~~