Tablesorter輸出爲CSV將不會觸發

對於我而言，我似乎無法讓tablesorter的下載CSV功能起作用。我想也許這是我的設置有問題，所以我創建了一個裸露的測試表，但仍遇到同樣的問題。Tablesorter輸出爲CSV將不會觸發

根據official documentation，我需要tablesorter 2.8或更高（我在2.25.3）和jQuery 1.7或更高（我在拉動jQuery 1.12.0）。我遵循Mottie從this question的簡單設置，但我沒有運氣。

下面是我的測試代碼。我不得不失去一些明顯的東西，但是在盯着它幾個小時之後，我沒有看到它。

<head> 
    <title>Table to CSV</title> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.25.4/js/jquery.tablesorter.combined.min.js"></script> 
</head> 
<body> 
    <button class="download">Download CSV</button> 
    <table class="tablesorter"> 
     <thead> 
      <tr> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Number</th> 
       <th>Food</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Billy</td> 
       <td>Bob</td> 
       <td>4</td> 
       <td>Pizza</td> 
      </tr> 
      <tr> 
       <td>Jill</td> 
       <td>Jackson</td> 
       <td>23</td> 
       <td>Tacos</td> 
      </tr> 
      <tr> 
       <td>Robert</td> 
       <td>Roy</td> 
       <td>6</td> 
       <td>Hamburger</td> 
      </tr> 
     </tbody> 
    </table> 

    <script> 
     $(document).ready(function(){ 
      var $table = $("table"); 

      $table.tablesorter({ 
       widgets: ["output"] 
      }); 

      $('.download').click(function(){ 
       $table.trigger("outputTable"); 
       console.log("Download clicked."); 
      }); 
     }); 
    </script> 
</body>

編輯：用cloudflare's將我自己的[local] tabelsorter腳本src換出來。

來源

2016-02-29 Steve

我粘貼你的代碼，並運行它，並在調試器（F12），當它到達行$ table.tablesorter {{它說_object不支持屬性或方法'tablesorter'_ –

您是否正在加載自己的tablesorter？我在本地加載我的（見src標籤），所以如果你沒有修改它來加載你自己的，它不會找到它感謝您的快速回復！ – Steve

我看到現在和我只是試圖找到一個CDN，當你運行它時，你在F12控制檯中看到了什麼？ –

我認爲你只缺少widget-output.js文件：

https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.25.4/js/widgets/widget-output.min.js

應該使用的tablesorter <script>後加載。點擊this demo的「外部資源」部分查看您需要的所有文件（不包括jQuery）。

來源

2016-03-01 01:58:56 Mottie

公頃 - 我添加了這個參考，它爲我工作....所以我很想知道我是否可以從F12控制檯的某個地方收集這些缺失的參考資料？ –

我知道它必須是我的一些愚蠢的東西。非常感謝你，莫蒂！當我觀看演示時，我在想如何能夠看到正在加載的腳本 - 從不會注意到左側的導航選項卡。謝謝你。 – Steve

@ Nick.McDermaid當'debug'選項被設置時，我可以在控制檯中添加一個警告。 – Mottie

Tablesorter輸出爲CSV將不會觸發

回答

相關問題