addEventListener("click")被调用两次

addEventListener("click") getting called twice

本文关键字：quot 两次 click addEventListener 调用      更新时间：2023-09-26

我有2个不同的按钮，我希望用户能够键入签名。当我点击其中一个时，它工作得很好。但是，当我单击下一个按钮而不刷新页面时，它将运行第二个按钮的流程，但随后再次运行第一个选项的流程。

谁能帮助我找出我做错了什么，只有1个按钮将被处理时，点击?

$('#button1').click(function (event) {
var id = "button1",
    sigSign = $(this);
signatureSignage(id, sigSign);
});
$('#button2').click(function (event) {
var id = "button2",
    sigSign = $(this);
signatureSignage(id, sigSign);
});

function signatureSignage(id, sigSign) {
$("#sigPadContainer").fadeIn();
$('#closeSigPad').click(function (event) {
    $("#sigPadContainer").fadeOut();
});
var wrapper = document.getElementById("signature-pad"),
    clearButton = wrapper.querySelector("[data-action=clear]"),
    saveButton = wrapper.querySelector("[data-action=save]"),
    canvas = wrapper.querySelector("canvas"),
    signaturePad;
function resizeCanvas() {
    var ratio = window.devicePixelRatio || 1;
    canvas.width = canvas.offsetWidth * ratio;
    canvas.height = canvas.offsetHeight * ratio;
    canvas.getContext("2d").scale(ratio, ratio);
}
window.onresize = resizeCanvas;
resizeCanvas();
signaturePad = new SignaturePad(canvas);
clearButton.addEventListener("click", function (event) {
    signaturePad.clear();
});
saveButton.addEventListener("click", function (event) {
    if (signaturePad.isEmpty()) { /* alert you forgot to sign */ } else { /* This get's run twice */ }
});
}

@NiettheDarkAbsol为我指明了正确的方向。这是我的新代码，以防有人感兴趣。

var wrapper = document.getElementById("signature-pad"),
clearButton = wrapper.querySelector("[data-action=clear]"),
saveButton = wrapper.querySelector("[data-action=save]"),
id, signaturePad;
/* Signature Sign */
$('.sigSign').click(function(event) {
    id = $(this).attr("name");
         if(id == "sig1") { signatureSignage(id); }
    else if(id == "sig2") { signatureSignage(id); }
});
$('#sig1').click(function(event) {
    id = "sig1";
    signatureSignage(id);
});
$('#sig2').click(function(event) {
    id = "sig2";
    signatureSignage(id);
});

$('#closeSigPad').click(function(event) { $("#sigPadContainer").fadeOut(); });
clearButton.addEventListener("click", function (event) { signaturePad.clear(); });
saveButton.addEventListener("click", function (event) { /* Do the save thing */ });
function signatureSignage(id)
{
    $("#sigPadContainer").fadeIn();
    var wrapper = document.getElementById("signature-pad"), canvas = wrapper.querySelector("canvas");
    function resizeCanvas() {
        var ratio =  window.devicePixelRatio || 1;
        canvas.width = canvas.offsetWidth * ratio;
        canvas.height = canvas.offsetHeight * ratio;
        canvas.getContext("2d").scale(ratio, ratio);
    }
    window.onresize = resizeCanvas;
    resizeCanvas();
    signaturePad = new SignaturePad(canvas);
}
相关文章：