Question

我有一些内嵌JavaScript，用于使用签名板https://github.com/szimek/signature_pad 看起来像这样：

var signaturePad = new SignaturePad(canvas, {
  backgroundColor: 'rgb(255, 255, 255)'
});
clearButton.addEventListener("click", function (event) {
  signaturePad.clear();
});

在页脚中，我有一个单独的文件 click.js

$('.send-signature').on( 'click', function( event ) {
        event.preventDefault();
        console.log(event);
        var $button = $(this);
        $button.prop("disabled",true);
        if (signaturePad.isEmpty()) {
            alert("Please provide a signature first.");
            return false;
        } 

} );

当我单击按钮时，我得到： 未捕获的ReferenceError：未定义signaturePad

如果我单击清除按钮按钮，则可以正常工作。我不明白问题是什么以及如何将signaturePad传递给点击处理程序。

Click.js 包含在嵌入式javascript下方。

我尝试了许多不同的解决方案，但是我认为这是我所遇到的最远的解决方案。有人可以指出我正确的方向，然后说为什么这不起作用吗？

Answer 1

您可以将signaturePad变量保存在窗口对象中

window.signaturePad = new...

然后以相同方式访问它

window.signaturePad.isEmpty()

这不是执行javascript的最漂亮方法，但我认为您可以使用它。

Answer 2

您可以尝试在clearButton行下添加此内容吗？另外，也许将send-signature更改为addListener格式，看看是否有任何改变。

$('.send-signature').on( 'click', function( event ) {
    event.preventDefault();
    console.log(event);
    var $button = $(this);
    $button.prop("disabled",true);
    if (signaturePad.isEmpty()) {
        alert("Please provide a signature first.");
        return false;
    } 

} );

将内联Javascript中的变量传递到单独文件中的单击处理程序

2 个答案: