title: How to insert image from HTML to PDF with jsPDF library?
body: <p>As <strong>jspdf</strong> does not support utf8 characters, I'm trying to replace some of the characters with images and then export it in pdf. To help you understand, I made the sample of code, where I try to put an image in html div, and then paste this into the pdf with jspdf. The text appears in pdf, but no image, so whats the issue? I am a beginner, so please explain me how to do this.</p>
  
  <p>TRY THIS LINK AND SEE THE PROBLEM: <a href="http://www.balkanex.info/test/start.html" rel="nofollow">http://www.balkanex.info/test/start.html</a></p>
  
  <p>And the code is below:</p>
  
  <p><strong>start.html</strong></p>
  
  <pre><code>&lt;!doctype&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;script type="text/javascript" src="runner.js" charset="utf-8"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="script.js" charset="utf-8"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jquery/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jspdf.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/libs/Deflate/adler32cs.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/libs/FileSaver.js/FileSaver.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/libs/Blob.js/BlobBuilder.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jspdf.plugin.addimage.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jspdf.plugin.standard_fonts_metrics.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jspdf.plugin.addimage.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jspdf.plugin.split_text_to_size.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jspdf/jspdf.plugin.from_html.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;input type="button" id="btn" value="PROCEED TO THE NEXT PAGE" onClick="run();pdf();"&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>runner.js</strong></p>
  
  <pre><code>function run() {
      document.write('&lt;div id="myid"&gt;This is the image: &lt;img src="button.png" alt="Submit"&gt; &lt;/div&gt;&lt;br/&gt;');
      document.write('&lt;button id="pdf"&gt;Export in pdf&lt;/button&gt;&lt;/div&gt;');
  }
  </code></pre>
  
  <p><strong>script.js</strong></p>
  
  <pre><code>function pdf() {
  $(function () {
      var doc = new jsPDF();
      var specialElementHandlers = {
          'body': function (element, renderer) { 
              return true;
          }};
      $('#pdf').click(function () {
          doc.fromHTML($('#myid').html(), 15, 35, {
              'width': 170,
                  'elementHandlers': specialElementHandlers
          });
          doc.save('sample.pdf');
      });
  });
  }
  </code></pre>