関数の再帰を使用して動的を実装する...

ツリー メニューは、多くのデスクトップ アプリケーション システムで広く使用されており、その主な利点は、構造が明確であり、ユーザーが現在の場所を明確に把握できることです。ただし、Web 上のツリー メニューのアプリケーションでは、直接使用できる理想的な既成コンポーネントが存在しないため、プログラマは主に JavaScript を使用していくつかの単純なツリー構造のメニューを実装しますが、これらのメニューは で用意されることがよくあります。各メニュー項目と各メニュー項目間の階層関係を定義すると、別のメニュー構造が必要になることが多く、あまり便利ではありません。

関数の再帰を勉強した結果、この種のツリー メニューは再帰関数を通じてツリー メニューの表示を動的に変更でき、系列の数に制限がないことがわかりました。以下は、私が php、MySQL、JavaScript を使って書いた動的ツリー メニューの処理コードです。興味があれば、私と一緒に実装方法を見てください:)

まず、データベースが必要です。データベースで、次のテーブルを作成します:

CREATE TABLE menu ( 
id tinyint(4) NOT NULL auto_increment, 
parent_id tinyint(4) DEFAULT '0' NOT NULL, 
name varchar(20), 
url varchar(60), 
PRIMARY KEY (id) 
);

このテーブルでは、
id はインデックスです
parent_id は上位レベルのメニューの ID 番号を保存するために使用されます。それが第 1 レベルのメニューの場合は 0 です
name はメニューの名前、つまりページに表示されるメニューの内容
url メニューが最終レベルのメニューの場合、接続の URL アドレスを指定する必要があります。このフィールドは、このアドレスを保存するために使用されます。他の最終レベル以外のメニューの場合、このフィールドは空です

データベースができたので、いくつかのレコードを追加できます。テスト時に使用したレコードをいくつか示します。

INSERT INTO menu VALUES ( '1', '0', '人事管理', ''); 
INSERT INTO menu VALUES ( '2', '0', '通讯交流', ''); 
INSERT INTO menu VALUES ( '3', '1', '档案管理', ''); 
INSERT INTO menu VALUES ( '4', '1', '考勤管理', 'http://localhost/personal/attendance.php'); 
INSERT INTO menu VALUES ( '5', '2', '通讯录', ''); 
INSERT INTO menu VALUES ( '6', '2', '网络会议', ''); 
INSERT INTO menu VALUES ( '7', '3', '新增档案', 'http://localhost/personal/add_achive.php'); 
INSERT INTO menu VALUES ( '8', '3', '查询档案', 'http://localhost/personal/search_archive.php'); 
INSERT INTO menu VALUES ( '9', '3', '删除档案', 'http://localhost/personal/delete_archive.php'); 
INSERT INTO menu VALUES ( '10', '5', '新增通讯记录', 'http://localhost/communication/add_address.php'); 
INSERT INTO menu VALUES ( '11', '5', '查询通讯记录', 'http://localhost/communication/search_address.php'); 
INSERT INTO menu VALUES ( '12', '5', '删除通讯记录', 'http://localhost/communication/delete_address.php'); 
INSERT INTO menu VALUES ( '13', '6', '召开会议', 'http://localhost/communication/convence_meeting.php'); 
INSERT INTO menu VALUES ( '14', '6', '会议查询', 'http://localhost/communication/search_meeting.ph');

レコードを追加するときは、次のようにします。第一レベル以外のメニューのparent_idに必ず注意してください。上位レベルのメニューのID番号として必ず指定してください。そうしないと、メニューが表示されません:)

わかりました!データベースでは、以下は php と JavaScript を通じてデータベースからメニューを読み取って表示します:)

1. JavaScript スクリプト:

function ShowMenu(MenuID) 
{ 
if(MenuID.style.display=="none") 
{ 
MenuID.style.display=""; 
} 
else 
{ 
MenuID.style.display="none"; 
} 
}

このスクリプトは非常に単純で、特定のクリックに応答するために使用されます。イベントのメニュー。

2. CSS ファイル:

TD { 
FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; LINE-HEIGHT: 130%; letter-spacing:1px 
} 
A:link { 
COLOR: #990000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: none; letter-spacing:1px 
} 
A:visited { 
COLOR: #990000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: none; letter-spacing:1px 
} 
A:active { 
COLOR: #990000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: none; letter-spacing:1px 
} 
A:hover { 
COLOR: #ff0000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: underline; letter-spacing:1px 
} 
.Menu { 
COLOR:#000000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; CURSOR: hand 
}

は、フォント、色、ハイパーリンクのスタイルなど、いくつかの基本的なスタイル情報を定義します。スタイルを変更したい場合は、ここで変更するだけです。

3. 以下は私の php ページです。

//基本的な変数設定
$GLOBALS["ID"] =1; //ドロップダウン メニューの ID 番号を追跡するために使用されます
$layer=1; //現在のメニューのレベルを追跡するために使用されます

//データベースに接続します
$Con=mysql_connect("localhost","root","");
mysql_select_db("work");
$sql="select * from menu whereparent_id=0";
$result=mysql_query($sql,$Con);

//第 1 レベルのメニューが存在する場合、メニューの表示を開始します
if(mysql_num_rows($result)>0 ) ShowTreeMenu($Con,$result,$layer,$ ID)


//=========================== =============== ===
//ツリーメニュー関数の表示 ShowTreeMenu($con,$result,$layer)
//$con: データベース接続
//$result:表示する必要があるメニュー レコード セット
//layer: 表示する必要があるもの メニューのレベル
//========================= ===================== ==
function ShowTreeMenu($Con,$result,$layer)
{
//必要なメニュー項目の数を取得します
$numrows=mysql_num_rows($result);

//メニュー、各サブメニューの表示を開始します
echo " "を表すためにテーブルを使用します

for($rows=0;$rows<$numrows;$ rows++)
{
//現在のメニュー項目の内容を配列にインポートします
$menu=mysql_fetch_array($result) ;

//メニュー項目のサブメニュー レコード セットを抽出します
$sql="select * from menuparent_id =$menu[id]";
$result_sub=mysql_query($sql,$Con);

echo " " ;
//メニュー項目にサブメニューがある場合は、JavaScript onClick ステートメントを追加します
if(mysql_num_rows($result_sub) )>0)
{
echo " ";
echo " ";
else
{
echo " ";
// メニュー項目にサブメニューがない場合、指定した場合はハイパーリンクとして指定されます。
//それ以外の場合はメニュー名のみが表示されます
if($menu[url]! ="")
echo "$menu[name]"
else
echo $menu[name] ];
echo "



";

//メニュー項目にサブメニューがある場合は、サブメニューを表示します
if(mysql_num_rows($result_sub)>0)
{
// onClick ステートメントに対応するサブメニュー
echo " ";
echo " ";
//系列が 1 ずつ増加します
$layer++ 関数を再帰的に呼び出してサブメニューを生成します
ShowTreeMenu($Con,$result_sub,$layer);
//サブメニューの処理が完了し、系列を 1 つ減らします
echo "
"; // 次のメニュー項目を表示し続けます
}
echo " ";
?>



上記の php ページ内で、この関数の呼び出しを通じて各メニューを定義しました。項目はデータベースから再帰的に呼び出され、ページに表示されます:)


関連コンテンツの記事をさらに取得したい場合は、PHP 中国語 Web サイト (www.php.cn) にご注意ください。