html2canvasはasp.netで動作しません

Question

jqueryの下で使用されているコードはうまく見えますが、なぜhtml2canvasを動作させることができないのか困惑していると言われました。ボタンをクリックしても応答が得られません。私はボタンで他のメソッドを試して、彼らは正常に動作します。誰かが私が間違っているかもしれないと助言してもらえますか？

私はjqueryのは、次のとおりです。

$(document).ready(function() { 
    $('#Print_Button').click(function() { 
     html2canvas($('#form1'),{ 
      onrendered: function(canvas) { 
      cvs = canvas.toDataURL('image/png'); 
      window.open(cvs) 
     } 
    }); 
    }); 
}); 

とHTMLは次のとおりです。$がJQuery selector.ある

<table id="table_1""> 
    <tr> 
     <td class="auto-style12">MCN Ref No.</td> 
     <td> 
      <asp:TextBox ID="TextBox1" ReadOnly="True" runat="server" Width="116px"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style12">Date:</td> 
     <td> 
      <asp:TextBox ID="TextBox4" ReadOnly="True" runat="server" Width="116px"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style12">Time:</td> 
     <td> 
      <asp:TextBox ID="TextBox5" runat="server" ReadOnly="True" Width="116px"></asp:TextBox> 
     </td> 
    </tr> 
</table> 

<img alt="Logo" class="auto-style10" src="logo.png" /><div id ="form"> 
<table id="main_table" class = "table table-bordered"> 
    <tr> 
     <td class="auto-style8">SITE:</td> 
     <td class="auto-style9"> 
      <asp:TextBox ID="TextBox6" runat="server" OnTextChanged="TextBox6_TextChanged" ReadOnly="True"></asp:TextBox> 
     </td> 
     <td class="auto-style4">HAULIER(CARRIER):</td> 
     <td> 
      <asp:TextBox ID="TextBox10" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style8">DESCRIPTION OF WASTE:</td> 
     <td class="auto-style9"> 
      <asp:TextBox ID="TextBox7" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
     <td class="auto-style4">DESTINATION:</td> 
     <td> 
      <asp:TextBox ID="TextBox9" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style8">EWC CODE:</td> 
     <td class="auto-style9"> 
      <asp:TextBox ID="TextBox8" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
     <td class="auto-style4">VEHICLE REGISTRATION:</td> 
     <td> 
      <asp:TextBox ID="TextBox11" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style8">QUANTITY:</td> 
     <td class="auto-style9"> 
      <asp:TextBox ID="TextBox13" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
     <td class="auto-style4">DRIVER NAME:</td> 
     <td> 
      <asp:TextBox ID="TextBox12" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style8">NOMINAL WEIGHT:</td> 
     <td class="auto-style9"> 
      <asp:TextBox ID="TextBox15" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
     <td class="auto-style4">SKIP ID:</td> 
     <td> 
      <asp:TextBox ID="TextBox16" runat="server" ReadOnly="True"></asp:TextBox> 
     </td> 
    </tr> 
    </table> 


    <table id="table_2" style="width:30%;"> 
     <tr> 
      <td>DUTY OF CARE:</td> 
      <td> 
       <asp:TextBox ID="TextBox14" runat="server" OnTextChanged="TextBox14_TextChanged"></asp:TextBox> 
      </td> 
     </tr> 
    </table> 
</div> 

<p id="tsandcs"> 

</p> 

Answer 1

ので。 jqueryを使用しない場合$('#Print_Button')はnullを返します。ボタンの代わりにnull onclickイベントを購読しています。あなたのコードは、jqueryのなしで動作したい場合は、私は私のためにこれを修正するためにあなたに感謝し、あなたのコードは

document.addEventListener("DOMContentLoaded", function(event) { 
    document.getElementById("Print_Button").click(function() { 
     html2canvas(document.getElementById("form1"),{ 
      onrendered: function(canvas) { 
      cvs = canvas.toDataURL('image/png'); 
      window.open(cvs) 
     } 
    }); 
    }); 
});