4

我正在尝试使用这个(GitHub),我的“Draw It”按预期工作,但“Type It”功能在我的inputHidden领域没有给我任何价值。

请参阅 VF 页面代码和屏幕截图以获取更多信息:

画出来 绘制它显示

输入它 类型它没有显示任何

VF 页面代码

<apex:page standardController="Case" extensions="signaturepadCaseController">
   <apex:includeScript value="{!URLFOR($Resource.jQuery,'js/jquery-1.6.2.min.js')}" />
   <apex:includeScript value="{!URLFOR($Resource.signature,'/signature/jquery.signaturepad.min.js')}" />
   <apex:includeScript value="{!URLFOR($Resource.signature,'/signature/json2.min.js')}" />
   <apex:stylesheet value="{!URLFOR($Resource.signature,'/signature/jquery.signaturepad.css')}" />

   <form method="post" action="#" class="sigPad">
       <label for="name">Print your name</label>
       <input type="text" name="name" id="name" class="name"/>
       <p class="typeItDesc">Review your signature</p>
       <p class="drawItDesc">Draw your signature</p>
      <ul class="sigNav">
         <li class="typeIt"><a href="#type-it" class="current">Type It</a></li>
         <li class="drawIt"><a href="#draw-it">Draw It</a></li>
         <li class="clearButton"><a href="#clear">Clear</a></li>
      </ul>
       <canvas class="pad" width="198" height="55" id="signatureCanvas1"></canvas>
      <div class="sig sigWrapper">
         <div class="typed" id="typeit">             
         </div>

         <canvas class="pad" width="198" height="55" id="signatureCanvas"></canvas>
         <input type="hidden" name="output" class="output" id="hidden"></input>

      </div>
      <input type="button" onclick="saveSignature();" value="Accept" class="btn" target="_parent" />
   </form>
   <script>
     // $('.sigPad').signaturePad(options);
      j$ = jQuery.noConflict();
      var api;
      j$(document).ready(function() {
          api = j$('.sigPad').signaturePad();
      });

      var canvas;
      var canvas1;
      var RecordID = '';

      function saveSignature() {
          canvas = document.getElementById("signatureCanvas");
          canvas1 = document.getElementById("signatureCanvas1");
         // if(j$('#hidden').val() == ''){                     
         //       alert('Please draw your signature');
         // }           
         // else{
              RecordId = '{!caseId}';
              var imgData;

              typeSign = j$('#typeit').text();

              if (typeSign != '') {                  
                  var ctx = canvas1.getContext("2d");
                  ctx.fillText(typeSign, 10, 10);      
              }
              imgData = canvas1.toDataURL("image/jpeg");
              imgData = imgData.split(',')[1];
              console.log('---'+imgData);
              strDataURI = imgData;              
              SignaturePad.signaturepadCaseController.saveSignature(strDataURI, RecordId, handleResult);
         // }
      }

      function handleResult(result) {

          if (result.indexOf('success:true')) {
              //window.top.location = '/{!Case.id}';
          } else {
              alert(result);
          }
      }
   </script>
</apex:page>
4

1 回答 1

0

output变量仅在绘制签名时设置。键入签名时,不会绘制画布,而是覆盖带有文本的 div 以创建效果。如果您可以分叉代码,您可以在项目的问题跟踪器中查看更多详细信息问题以及可能的解决方案。

于 2021-01-14T02:26:29.020 回答