Works on JSFiddle but not locally? [closed]

问题

this jsfiddle works fine for me http://jsfiddle.net/xzZ7n/1/
However, when I try to run it locally or from Sharepoint, nothing happens when I press the pdf button.
Any idea why this happens?
here is my code:

    <!DOCTYPE html>
    <html>
    <head>
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <title> - jsFiddle demo</title>
      
      <script type='text/javascript' src='//code.jquery.com/jquery-git.js'></script>
      
      
      
      
      <link rel="stylesheet" type="text/css" href="/css/result-light.css">
      
        
          <script type='text/javascript' src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
        
      
        
          <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
        
      
        
          <script type='text/javascript' src="http://mrrio.github.io/jsPDF/dist/jspdf.debug.js"></script>
        
      
      <style type='text/css'>
        
      </style>
      
    </head>
    <body>
      <div id="customers">
        <table id="tab_customers" class="table table-striped">
            <colgroup>
                <col width="20%">
                    <col width="20%">
                        <col width="20%">
                            <col width="20%">
            </colgroup>
            <thead>
                <tr class='warning'>
                    <th>Country</th>
                    <th>Population</th>
                    <th>Date</th>
                    <th>Age</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Chinna</td>
                    <td>1,363,480,000</td>
                    <td>March 24, 2014</td>
                    <td>19.1</td>
                </tr>
                <tr>
                    <td>India</td>
                    <td>1,241,900,000</td>
                    <td>March 24, 2014</td>
                    <td>17.4</td>
                </tr>
                <tr>
                    <td>United States</td>
                    <td>317,746,000</td>
                    <td>March 24, 2014</td>
                    <td>4.44</td>
                </tr>
                <tr>
                    <td>Indonesia</td>
                    <td>249,866,000</td>
                    <td>July 1, 2013</td>
                    <td>3.49</td>
                </tr>
                <tr>
                    <td>Brazil</td>
                    <td>201,032,714</td>
                    <td>July 1, 2013</td>
                    <td>2.81</td>
                </tr>
            </tbody>
        </table>
    </div>
    <button onclick="javascript:demoFromHTML();">PDF</button>
      
    
    
    <script type='text/javascript'>//<![CDATA[ 
    
    function demoFromHTML() {
        var pdf = new jsPDF('p', 'pt', 'letter');
        // source can be HTML-formatted string, or a reference
        // to an actual DOM element from which the text will be scraped.
        source = $('#customers')[0];
    
        // we support special element handlers. Register them with jQuery-style 
        // ID selector for either ID or node name. ("#iAmID", "div", "span" etc.)
        // There is no support for any other type of selectors 
        // (class, of compound) at this time.
        specialElementHandlers = {
            // element with id of "bypass" - jQuery style selector
            '#bypassme': function (element, renderer) {
                // true = "handled elsewhere, bypass text extraction"
                return true
            }
        };
        margins = {
            top: 80,
            bottom: 60,
            left: 40,
            width: 522
        };
        // all coords and widths are in jsPDF instance's declared units
        // 'inches' in this case
        pdf.fromHTML(
        source, // HTML string or DOM elem ref.
        margins.left, // x coord
        margins.top, { // y coord
            'width': margins.width, // max width of content on PDF
            'elementHandlers': specialElementHandlers
        },
    
        function (dispose) {
            // dispose: object with X, Y of the last line add to the PDF 
            //          this allow the insertion of new lines after html
            pdf.save('Test.pdf');
        }, margins);
    }
    //]]>  
    
    </script>
    
    
    </body>
    
    
    </html>

Any idea why doesn't work? Thanks!

回答1:

Most of the dependencies URLs you included in the <head /> are broken because you omit a part of it: you need to add some http:// to obtain valid remote URLs.

                            here ------|
<head>                                 v
  <script type='text/javascript' src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  <!-- Same thing for other libraries you use... -->
</head>

Also you forgot to include jQuery, just at the beginning of the <head> tag.

<head>
  <script type="text/javascript" src="http://code.jquery.com/jquery-git.js"></script>
</head>

来源：https://stackoverflow.com/questions/28766357/works-on-jsfiddle-but-not-locally

标签

javascript

jquery

jsfiddle