0

我需要 jSignature 方面的帮助。我能够创建一个图像，然后将该图像写回页面。我无法工作（以及我最初探索这个插件的原因）是将图像导出到页面之外。我想获取图像数据并将其通过电子邮件发送出去，以便图像显示在电子邮件的正文中。如果尝试了很多方法，但没有任何效果。目前我的 js 看起来像这样：

var $sigDiv = $("#signature").jSignature();
      $('<input type="button" value="Reset">').bind('click', function(e){
        $sigDiv.jSignature('reset');
      }).appendTo($sigDiv);

提交表单后，它看起来像这样：

var datapair = $sigDiv.jSignature("getData", "svg");
      var i = new Image();
      i.src = "data:" + datapair[0] + "," + datapair[1];
      $(i).appendTo($("#success"));

我尝试在变量中获取该图像数据，并通过 AJAX 将其以数据字符串的形式发送到 PHP 邮件处理表单，执行如下操作：

<img src="<?php echo $_POST['signature']; ?>"/>

或这个：

<object src="<?php echo $_POST['signature']; ?>"></object>

我已经筋疲力尽地试图让它在发出的电子邮件中显示图像。任何帮助深表感谢。

4

2 回答 2

1

耶！让它工作。如果我导出为图像并在图像上执行 encodeURIComponent(image) ，则 AJAX 调用不会破坏图像数据。现在像野兽一样工作。嘿感谢您的帮助阿比德。

于 2012-08-17T16:18:47.587 回答
0

我不确定，但你看到下面的网址我认为这对你很有帮助

https://github.com/brinley/jSignature/

演示网址；-

http://willowsystems.github.com/jSignature/#/demo/

jSignature 是一个 jQuery 插件，它简化了在浏览器窗口中创建签名捕获字段，允许用户使用鼠标、笔或手指绘制签名。

jSignature 将签名捕获为笔画的矢量轮廓。虽然 jSignature 也可以导出出色的位图 (PNG)，但提取签名的高度可扩展的笔画移动坐标（也称为矢量图像）允许签名渲染的更大灵活性。

额外的努力（通过平滑和压力模拟）使笔画在屏幕上看起来很漂亮，而这些是由签名者绘制的。

支持所有主要的桌面、平板电脑和手机浏览器。默认使用 HTML5 Canvas 元素。当浏览器不支持实际的 Canvas（Iinternet Explorer v.8 及更低版本）时，我们将使用基于 Flash 的 Canvas 元素模拟器 (FlashCanvas)。

实时 jSignature 仅呈现我们捕获的适合设备的“最漂亮”近似值。数据的捕获总是相同的——我们捕获尽可能多的运动坐标。笔画的渲染因浏览器的功能、设备的效率、屏幕大小而异。

捕获签名的屏幕表示的这种降级和增强是有目的的，以确保呈现不会影响捕获的响应性。例如，在慢速渲染设备（Android 浏览器、基于 FlashCanvas 的 Canvas 仿真）上，平滑提升了一个档次，以补偿捕获的笔画坐标中的大间隙 - 这是捕获设备效率低下的结果。在所有情况下，客户都会对图纸的响应能力和美观感到满意。

jSignature 可以很容易地将自己融入现有的风格站点。jSignature 自动检测包装元素上使用的颜色（文本颜色 = 笔颜色，背景 = 背景）并自动为“装饰”（签名线）选择一个令人愉悦的中间阴影。jSignature 可以很好地适应固定和可变宽度的网页设计，以及各种尺寸的屏幕（手机、平板电脑、电脑屏幕），并在父元素改变大小时自动重新缩放绘图区域和签名

于 2012-08-17T15:51:14.080 回答