無限級分類是電商、CMS 等系統常見需求。本文透過遞歸演算法搭配 MySQL 資料庫,實作一個可展開/摺疊的樹狀分類介面,並支援分類的新增、編輯、刪除操作。
核心欄位包含:id(主鍵)、name(分類名稱)、bid(父分類 ID,0 代表頂層)、url(連結)等。
function treemenu($conn, $result, $jibie) { $numrows = mysql_num_rows($result); echo "<table cellpadding='0' cellspacing='0' border='0'>"; for ($rows = 0; $rows < $numrows; $rows++) { $menu = mysql_fetch_array($result); $sql = "select * from tvmenu where bid=$menu[id]"; $result_sub = mysql_query($sql, $conn); echo "<tr>"; // 判斷是否有子分類,決定顯示展開圖示 if (mysql_num_rows($result_sub) > 0) { echo "<td width='20'><img src='+.gif' border='0'></td>"; echo "<td class='menu' onclick=\"javascript:showmenu(menu".$globals["id"].");\">"; } else { echo "<td width='20'><img src='-.gif' border='0'></td>"; echo "<td class='menu'>"; } // 顯示分類名稱與操作連結 if ($menu['url'] != "") { echo "<a href='$menu[url]'>$menu[name]</a> "; } else { echo "<a href='#'>$menu[name]</a> "; echo "<a href='?b={$menu[id]}&type=add'>新增</a> "; echo "<a href='?b={$menu[id]}&type=edit'>編輯</a> "; echo "<a href='?b={$menu[id]}&action=del'>刪除</a>"; } echo "</td></tr>"; // 遞歸處理子分類 if (mysql_num_rows($result_sub) > 0) { echo "<tr id=menu".$globals["id"]++." style='display:none'>"; echo "<td width='20'> </td><td>"; $jibie++; treemenu($conn, $result_sub, $jibie); $jibie--; echo "</td></tr>"; } } echo "</table>"; }
搭配 JavaScript showmenu() 函式控制子分類的顯示/隱藏。新增分類時透過下拉選單選擇父分類,表單送出後寫入資料庫。
mysql_* 函式