如何在单击“提交”按钮之前检查图像是否生成？

Question

我正在创建一个使用jSignature来捕获用户签名的ASP.NET MVC5应用程序。看起来像是这样，如果你不熟悉这个插件：

当用户点击“保存”时，会生成其签名的图片并将其保存在签名板下方的<img/>右侧：

我想做一些前端验证，以确保用户点击了“保存”，因此在提交整个表单之前生成了签名图像。如果可能的话，我想用jQuery做这件事。我有一个伪代码模型，我认为这个代码应该是什么样子，但是我无法将其转化为实际使用：

$("#entireFormSubmitButton").click(function(){
   if($("#imageOfSignature").doesNotExistOnPage){
      alert("Your signature is required before submitting this form");
      // also block the user from submitting form until signature provided
   }
});

我在编写这个自定义前端验证时遇到了麻烦，因为ASP.NET已经为我完成了大部分工作，以确保填写所有其他必填字段。我可以帮忙把它变成工作代码吗？

Answer 1

 $("#entireFormSubmitButton").click(function(e){
       //block the user from submitting and check for signature
       e.preventDefault();
       if( $("#imageOfSignature").length == 0 || 
           $("#imageOfSignature").attr("src") == "" || 
           $("#date-of-birth-input").val() == ""){
          alert("Your message");
       } else {
           //all good, an image exists
           $(this).closest('form').submit();
       }
    });