jSignature圖片導出到PHP電子郵件

Question

我需要有關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>

我已經精疲力盡了，試圖使它顯示在出去的電子郵件中的圖像。 任何幫助深表感謝。

Answer 1

沒錯！ 得到它的工作。 如果我導出為圖像，並在圖像上進行encodingURIComponent（image），則AJAX調用不會破壞圖像數據。 現在像BEAST一樣工作。 謝謝您的幫助，阿比德。

Answer 2

我不確定，但是您看到下面的網址，我認為這對您有幫助

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

演示網址;-

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

jSignature是一個jQuery插件，它簡化了瀏覽器窗口中簽名捕獲字段的創建，允許用戶使用鼠標，鋼筆或手指繪制簽名。

jSignature將簽名捕獲為筆划的矢量輪廓。 盡管jSignature也可以導出偉大的位圖（PNG），但是提取簽名的高度可縮放筆畫運動坐標（也稱為矢量圖像）可以使簽名渲染具有更大的靈活性。

做出額外的努力（通過平滑和壓力模擬），以使筆畫在簽名者繪制的同時在屏幕上看起來更漂亮。

支持所有主要的台式機，平板電腦和電話瀏覽器。 默認情況下使用HTML5 Canvas元素。 當瀏覽器不支持實際的Canvas（Inetnet Explorer v.8及更低版本）時，我們將使用基於Flash的Canvas元素仿真器（FlashCanvas）。

實時jSignature僅呈現與設備匹配的“最原始”近似值。 數據捕獲總是相同的-我們捕獲盡可能多的運動坐標。 筆划的呈現因瀏覽器的功能，設備的效率和屏幕尺寸而異。

對捕獲的簽名的屏幕表示的這種降級和增強是有意完成的，以確保渲染不會影響捕獲的響應能力。 例如，在渲染速度較慢的設備（Android瀏覽器，基於FlashCanvas的Canvas仿真）上，平滑處理會出現一個缺口，以補償捕獲的筆划坐標中的較大間隙（捕獲設備效率低下的結果）。 在任何情況下，客戶的意見都對圖紙的響應能力和美觀程度感到滿意。

使用jSignature可以很容易地將自己插入到現有樣式的站點中。 jSignature會自動檢測包裝元素上使用的顏色（文本顏色=筆顏色，背景=背景），並自動為“裝飾”（簽名行）選擇一個令人滿意的中間陰影。 jSignature非常適合固定寬度和可變寬度的網頁設計以及各種大小的屏幕（電話，平板電腦，計算機屏幕），並且在父元素更改大小時自動重新縮放繪圖區域和簽名