我如何排序表中的DIV中

Question

請看看這段代碼

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_sort_table_desc

如果我嘗試表HTML追加到使用jQuery一個div，則排序不起作用。的onclick進入排序功能，但後來什麼也沒有發生。

$(".betaCalc").append("<table border='1' id='myTable'>"); 
$(".betaCalc").append("<tr>"); 
$(".betaCalc").append("<th onclick='sortTable(0)'>Name</th>"); 
$(".betaCalc").append("<th onclick='sortTable(1)'>Country</th>"); 
$(".betaCalc").append("</tr>"); 
$(".betaCalc").append("<tr>"); 
$(".betaCalc").append("<td>Berglunds snabbkop</td>"); 
$(".betaCalc").append("<td>Sweden</td>"); 
$(".betaCalc").append("</tr>"); 
$(".betaCalc").append("<tr>"); 
$(".betaCalc").append(" <td>North/South</td>"); 
$(".betaCalc").append(" <td>UK</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append(" <tr>"); 
$(".betaCalc").append(" <td>Alfreds Futterkiste</td>"); 
$(".betaCalc").append(" <td>Germany</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append(" <tr>"); 
$(".betaCalc").append(" <td>Koniglich Essen</td>"); 
$(".betaCalc").append(" <td>Germany</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append(" <tr>"); 
$(".betaCalc").append(" <td>Magazzini Alimentari Riuniti</td>"); 
$(".betaCalc").append(" <td>Italy</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append(" <tr>"); 
$(".betaCalc").append(" <td>Paris specialites</td>"); 
$(".betaCalc").append(" <td>France</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append(" <tr>"); 
$(".betaCalc").append(" <td>Island Trading</td>"); 
$(".betaCalc").append(" <td>UK</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append(" <tr>"); 
$(".betaCalc").append(" <td>Laughing Bacchus Winecellars</td>"); 
$(".betaCalc").append(" <td>Canada</td>"); 
$(".betaCalc").append(" </tr>"); 
$(".betaCalc").append("</table>"); 

Answer 1

是的我得到了你的問題，這是不工作，因爲你從jquery追加整個表。

爲了解決這個問題，首先添加HTML頁的表格，然後追加動態錶行到該表。

，如： -

$(".betaCalc").append("<tr><td>Berglunds snabbkop</td><td>Sweden</td></tr>"); 

然後短路將正常工作。 感謝

入住這裏： - https://jsfiddle.net/Bibhudatta_sahoo/k7b04mjb/1/