Question

我正在使用jSignature来允许html格式的签名（确切地说是jQuery Mobile）。我希望能够使用表单提交签名图像。

使用下面的代码，我已经完成了前几个步骤 - 这对我来说已经足够了。它成功创建了DataURI（data：image / png; base64，iVBOR ...），并在调用placesig函数时将其添加到隐藏字段_fid_86的值。

我需要帮助： 1）如何将DataURI转换为可在提交时包含在表单数据中的图像？ 2）如何将该图像连接到隐藏输入？相同的方法是否有效，或者它是否需要是文件输入。

我正在通过webapp将此表单发布到QuickBase。理想情况下，我希望能够在没有任何服务器端参与的情况下完成此任务，以便应用程序可以自给自足，而不是依赖于php或其他托管脚本。

如果那是不可能的，我可以用PHP做，但仍然不知道如何实现这一点。

我花了好几天时间。我知道我缺乏编程知识是罪魁祸首。解决这个问题对我来说将是巨大的。

谢谢！

<body>
<script src="jquery-1.8.2.min.js"></script>
<script src="jquery.mobile-1.2.0.min.js"></script>
<script src="jSignature.js"></script>
</head>
<body>

<form name=qdbform method=POST onsubmit='return validateForm(this)' encoding='multipart/form-data' 

encType='multipart/form-data' action=https://www.quickbase.com/db/...?act=API_AddRecord>

<script type="text/javascript">
var $sigDiv = null;

$(document).ready(
    function() 
    {
        $sigDiv = $("#signature1").jSignature({'UndoButton':false,color:"#000000",lineWidth:2});
    }
);

function placesig() 
{
    var datapair = $sigDiv.jSignature("getData", "image");
    var i = new Image();
    i.src = "data:" + datapair[0] + "," + datapair[1];
    var src = $(i).attr('src');
    $("#_fid_86").val(src);

};
</script>

<div id="signature1"></div>

<input data-theme="a" type="button" value="Place Image" onclick="placesig();"/>

<input type="hidden" id="_fid_86" name="_fid_86" />

<input type="submit" value="Save">

</form>

Answer 1

没有服务器端代码就无法做到这一点。 jSignature将生成一个数据URL，但这不能作为multipart form文件上传处理方式的一部分传递。相反，jSignature将使用dataURL设置文本框，并且您可以在服务器上读取该文本框并生成文件。这实际上涵盖了一个名为jSignature_Tools_Base30.php的示例（在PHP中）。就个人而言，我会选择SVN example（线上数据越少，扩展的灵活性越大。

将DataURI作为html格式的图像文件发布

1 个答案: