[英]PreventDefault not working after checkbox "onchange"
我正在我的模態中使用簽名板 jQuery 插件。 我必須通過我的簽名批准處方。 我也有一個用於默認簽名的復選框。 如果我在目錄中有任何簽名圖像,它將在模式上顯示該圖像,默認復選框“已選中”。 有兩種可能我是否有默認簽名: 1. 使用默認簽名 2. 取消選中復選框並添加新簽名。 如果簽名板在任何情況下都是空的,表單將不會提交並提示錯誤消息。
我有一個 onchange 功能問題,當我將復選框狀態更改為“取消選中”時,簽名板 div 顯示,如果我將其保留為空並按下保存按鈕,它會提示我一條錯誤消息。 但是,當我再次“選中”和“取消選中”復選框時,“PreventDefault”功能不起作用,並且提交的表單帶有任何空的簽名板。
我的 JavaScript 代碼:
$('.already_signed').change(function(event) {
if (this.checked) {
$('.sign').hide(); // hide signaturepad
$(".already_signed").attr("checked", true); // checked the checkbox
$('.default_img').show(); // show the default image
document.getElementById('save').addEventListener("click", function (event) {
$('#sign_image').val(''); // if form is submitted with default signature keep the signature-pad hidden image input empty
document.getElementById('signature_alert').style.display = 'none'; // hide the error message as well
$('#signature_form').submit();
});
} else {
$('.sign').show(); // show signature-pad
$(".already_signed").attr("checked", false); // unchecked the checkbox
$('.default_img').hide(); // hide the default image
// jquery signature
var wrapper = document.getElementById("signature-pad"),
clearButton = wrapper.querySelector("[data-action=clear]"),
savePNGButton = wrapper.querySelector("[data-action=save-png]"),
saveSVGButton = wrapper.querySelector("[data-action=save-svg]"),
canvas = wrapper.querySelector("canvas"),
signaturePad;
signaturePad = new SignaturePad(canvas);
document.getElementById('save').addEventListener("click", function (event) {
if (signaturePad.isEmpty()) {
event.preventDefault();
var timePeriodInMs = 3000;
setTimeout(function()
{
document.getElementById("signature_alert").style.display = "none";
},
timePeriodInMs);
document.getElementById('signature_alert').style.display = 'block';
}
document.getElementById('signature_image').src = signaturePad.toDataURL();
var image = document.getElementById('signature_image').src;
document.getElementById('sign_image').value = image;
});
}
});
我也把 return false ,但仍然提交表單。 我在這方面深陷困境,如果你們中的任何人能在這方面幫助/指導我,我將不勝感激。 謝謝,
嘗試在未選中復選框時禁用該按鈕,並在用戶開始在鍵盤上書寫時啟用該按鈕。
$('.already_signed').change(function(event) {
if (!$("#checkbox").is(":checked")) {
$('input[type=submit]').attr('disabled', 'disabled');
}
});
var canvas = document.querySelector("canvas");
var signaturePad = new SignaturePad(canvas);
signaturePad.onBegin({$('input[type=submit]').removeAttr('disabled');});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.