我有一个签名捕获脚本,使用JS和Jquery以及HTML画布。
我正在处理签名,通过PNGURL将其转换为IMAGE / PNG。我想做的是POST结果PNGURL返回..但我遇到了问题。我对JS不太熟悉,但我已经在这方面工作了大约两天。正如您将能够看到我在发布hiddenDataURL时遇到问题。页面发布,转发到下一页,但hiddenDataURL显示为空。我已经使用警报测试了JS,以显示签名正确转换为PNGURL,但它没有正确地返回隐藏的表单元素,或者没有正确地发布到signatureaccepted.php页面。任何帮助是极大的赞赏。
这是我的两页。
JS在一个单独的页面上。
function signatureSave() {
var canvas = document.getElementById("newSignature"); // save canvas image as data url (png format by default)
var dataURL = canvas.toDataURL("image/png", 0.1);
document.getElementById("hiddenDataURL").value = dataURL;
document.getElementById("hiddenForm").submit();
};
和我试图发布的HTML表单。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="todataurl.js"></script>
<script src="signature.js"></script>
</head>
<body>
<div id="canvas">
<canvas class="roundCorners" id="newSignature" style="position: relative; margin: 0; padding: 0; border: 1px solid #c4caac;"></canvas>
</div>
<script>
signatureCapture();
</script>
<form id="hiddenForm" action="signatureaccepted.php" method="POST">
<input type="hidden" id="hiddenDataURL" />
</form>
<button type="button" onclick="signatureSave()">Sign Out</button>
<button type="button" onclick="signatureClear()">
Clear signature
</button>
</br>
Saved Image
</br>
<img id="saveSignature" alt="Saved image png" />
</body>
</html>
答案 0 :(得分:1)
您需要输入具有名称属性才能使用表单提交
<form id="hiddenForm" action="signatureaccepted.php" method="POST">
<input type="hidden" id="hiddenDataURL" name="hiddenDataURL"/>
</form>
不 必须与ID相同,但在这种情况下,它意味着您的更改量最少