二級聯動下拉列表選擇應用在在很多地方,比如說省市下拉聯動,商品大小類下拉選擇聯動。本文將通過例項講解使用jquery+php+mysql來實現大小分類二級下拉聯動效果。
先看下效果
大類:前端技術
程式開發
資料庫小類:
實現的效果就是當選擇大類時,小類下拉框裡的選項內容也隨著改變。實現原理:根據大類的值,通過jquery把值傳給後台php處理,php通過查詢mysql資料庫,得到相應的小類,並返回json資料給前端處理。
html
首先我們要建立兩個下拉選擇框,第乙個是大類,第二個是小類。大類的值可以是預先寫好,也可以是從資料庫讀取。
大類:jquerygetselectval()
>
前端技術
程式開發
資料庫
小類:
先寫乙個函式,獲取大類選擇框的值,並通過$.getjson方法傳遞給後台server.php,讀取後台返回的json資料,並通過$.each方法遍歷json資料,將對應的值寫入乙個option字串,最後將option追加到小類裡。
function在頁面初始的時候,下拉框是要設定選項的,所以在初始的時候就要呼叫getselectval(),而當大類選項改變時,也呼叫了getselectval()。getselectval(),function
(json));
});
}
php
include_once("connect.php"); //鏈結資料庫
$bigid = $_get["bigname"];
if(isset($bigid
))
echo json_encode($select
); }
二級聯動 下拉列表
二級聯動 下拉列表 需先選擇英雄,才能在選擇英雄的 html頁面 charset utf 8 二級聯動title head action method post 請選擇英雄 name hero id hero onchange skina select 請選擇 name skin id skin v...
js下拉列表二級聯動
學了js也有一段時間了,今天把js中較為重要的下拉列表二級聯動記錄一下。所謂二級聯動,就是要通過乙個下拉列表的選擇從而在另乙個select下拉列表中顯示出對應的資料。好比我有兩個下拉列表,第一列表是選擇省份,那麼我選擇某乙個省份,那麼另乙個列表也會對應顯示該省份的城市。如上圖所示,我選擇了河北省,那...
JS例項 二級聯動下拉列表
例項 省市二級聯動下拉列表 開啟頁面預設的省和市下拉框的的值分別為 請選擇省份 請選擇城市 在省下拉框選擇乙個省份,市下拉框則顯示相應城市名稱。然後就可以進行愉快的選擇啦!charset utf 8 省市二級聯動下拉列表例項title src js select.js script head s1 ...