0

这是我在数据库中保存 jSignature 值的代码:

var datapair = $('.sign-wrapper').jSignature();
datapair.bind('change', function(e){
        var data = datapair.jSignature("getData", "svgbase64");
        var i = new Image()
        i.src = "data:" + data[0] + "," + data[1];

        $(this).prev('input').val(i.src);
});

所以我在我的数据库中有以下价值:

data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmVyc2lvbj0iMS4xIiB3aWR0aD0iODkiIGhlaWdodD0iMTEyIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBkPSJNIDEgMTExIGMgMC4wNCAtMC4xNCAxLjAyIC01LjQ1IDIgLTggYyAyLjM0IC02LjA4IDUuOSAtMTEuODcgOCAtMTggYyAxLjg2IC01LjQ0IDMuMDkgLTExLjIyIDQgLTE3IGMgMS4xIC02Ljk4IDAuODggLTEzLjk4IDIgLTIxIGMgMS4yNSAtNy44MyAzLjA0IC0xNS4zOSA1IC0yMyBjIDAuNzEgLTIuNzYgMS43NiAtNS41MiAzIC04IGMgMS4wNSAtMi4wOSAyLjUyIC00LjA4IDQgLTYgYyAxLjg5IC0yLjQ2IDMuOTIgLTQuOTIgNiAtNyBjIDAuODEgLTAuODEgMi4yNiAtMi4yMiAzIC0yIGMgMS43NyAwLjUzIDUuMzcgMyA3IDUgYyAyLjM3IDIuOTEgNC40NiA3LjEzIDYgMTEgYyA1LjQ2IDEzLjc5IDkuMzIgMjguNTIgMTUgNDIgYyAyLjIzIDUuMjkgNi4zOCA5Ljc2IDkgMTUgYyAzLjQyIDYuODQgNS43NiAxNC43NiA5IDIxIGwgNCA0Ii8+PHBhdGggZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZD0iTSAyMCA2NCBjIDAuMTEgLTAuMTIgMy43MyAtNS40IDYgLTcgYyAyLjk4IC0yLjEgNy4yMSAtMy44NSAxMSAtNSBjIDcuMDcgLTIuMTQgMTQuNzggLTMuNzEgMjIgLTUgYyAxLjkyIC0wLjM0IDYgMCA2IDAiLz48L3N2Zz4=

因此,在重新加载页面时,我在隐藏变量中拥有上述 base64 图像数据 url。

我尝试使用以下代码将数据加载到现有的签名画布:

// If value exist load existing
      var src = $(this).prev('input').val();
      if(src != '') {
        datapair.jSignature("importData", src);
      }

但它不起作用,我在控制台中收到以下错误:

未捕获的错误:jSignature 无法找到格式为 'image/svg+xml;base64' 的导入插件

4

2 回答 2

2

当插件无法识别您的数据时,就会出现问题。

它抛出错误的原因是,导入器不支持格式'image/svg+xml;base64',只有导出器支持它。

参考: https ://github.com/brinley/jSignature#data-import--export-and-plugins

我建议您使用 base30 存储数据,因为同时支持导出和导入。

var data = datapair.jSignature("getData", "base30 ");
于 2017-05-30T17:59:05.983 回答
0

setData 有两个参数 - 数据对象,数据格式名称。当数据对象是以 data-url 模式格式化的字符串时,您不需要指定数据宿舍名称。数据格式名称 (mime) 将隐含在 data-url 前缀中。请参阅下面的示例。返回(以传统的 jQuery 可链接方式)jQuery 对象引用到应用插件的元素。

您可以将值存储在 base64 中并加载它。我在输入中加载 base64 中的值,并通过 Jquery 将其加载到对象中。

// Creo el objeto de firma.
$("#jq_sig").jSignature
({
    // width/height of signature pad
    width: 497,
    height: 200,
    // Format bootstrap 4
    cssclass: "bg-light border",
    lineWidth: 2,
    color: "black",
});

// I take the value of the form field that I previously loaded with PHP.
var firma = $('#form input[name=firma]').val();

if (firma.length > 0) 
{
    $("#jq_sig").jSignature("setData", 'data:image/png;base64,' + firma);                       
    console.log('Signature loaded.');
}
else
{
    console.log('Signature not loaded.');
}

您可以以任何格式保存到数据库中。然后你告诉'setdata'它是什么格式。

于 2021-12-14T11:50:30.433 回答