javascript - 如何使用 jSignature.js 在一个页面中显示多个签名？

Question

我试图在一个 PHP 页面中显示两个签名，但不幸的是，第一个签名字段似乎只是在工作，并且在添加另一个签名画布后消失了，见下文：

我试过改变 CSS 高度，但这不是问题，它仍然不起作用。

它必须与 div id 有关，因为另一个 div 具有相同的 id 名称 - “签名”并导致此问题。

我尝试将 JS: $("#signature") 更改为 $('div[id^="signature"]') 但实际的画布破裂并且看起来不像它应该的那样。

有谁知道如何解决这个问题或以前遇到过同样的问题？

score 1 · Accepted Answer

如果您使用$('div[id^="signature"]')，您将获得与您的 jQuery-Selector 匹配的对象数组。

因此，为了将 jSignature 应用于所有这些，您可以使用它.each来遍历所有这些：

$('div[id^="signature"]').each((index, value) => {
   $(value).jSignature({'UndoButton':true}); . .(rest of code)
}

但是，您应该确保每个 div 具有不同的 id。您可以使用id="signature1"并且id="signature2"仍然$('div[id^="signature"]')会找到它们。

score 0 · Accepted Answer

您应该为不同的签名分别初始化 jsignature 。您为带有签名的 div 提供不同的 id。例如，如果您分别给它们 id “signature”和“signature2”，则可以将它们初始化两次，如下所示：

var datapair = $("#signature").jSignature({'UndoButton':true}); . .（其余代码）。

var datapair = $("#signature2").jSignature({'UndoButton':true}); . .（其余代码）。

2 回答 2