本文爲博主原創,轉載請註明。javascript
首先看一下實現後的效果圖:php
固然,要完成這個實驗,mysql必須與數據庫鏈接,這裏選用navicat for mysql這款軟件,它與mysql的契合度是很高的,配置環境很少贅述,注意修改一下php的配置文件php.ini文件,將mysql.dll前面的那個「;」去掉,否則總會報數據庫鏈接函數的錯。html
將以上配置好後就進入代碼階段了,閒話很少說,直接上代碼:java
//2-7-3.php:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>省市級聯菜單</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(function(){ $("#province").change(function(){ var pid = $(this).val(); var data = { "pid":pid }; console.log(data); $.post("getCity.php",data,function(response){ console.log(response); // JSON.stringify(res); // console.log(json_decode(response)); // document.write('afdadf '); $("#city").html(response); }) }) }) </script> </head> <body> <select id="province"> <option>請選擇省份</option> <?php mysql_connect("localhost", "root", "123456"); mysql_select_db("lession"); mysql_query("set names utf8"); $sql = "select * from province"; $res = mysql_query($sql); while ($row = mysql_fetch_assoc($res)) { echo "<option value=\"{$row['id']}\">{$row['name']}</option>"; } ?> </select> <select id="city"> <option>選擇城市</option> </select> </body> </html>
而後是後臺服務器端的代碼:mysql
//getCity.php:
<?php if (isset($_POST["pid"]) && $_POST["pid"]) { $pid = $_POST['pid']; var_dump($pid); } // $pid = $_POST['pid']; $link = mysql_connect("localhost", "root", "123456"); //單個數據庫能夠省略變量返回值 mysql_select_db("lession",$link); mysql_query("set names utf8"); $sql = "select * from city where province_id={$pid}"; $res = mysql_query($sql); $citys = array(); if ($res) { while ($row = mysql_fetch_assoc($res)) { echo "<option value='{$row['id']}'>{$row['name']}</option>"; // $citys[] = array("id"=> $row['id'], 'name'=> $row['name']); } // echo json_encode($citys); }
對了,忘記交代了:前面的數據庫命名爲:lession jquery
寫到這瞬間發現原來沒有插入附件這項功能,原本還想上傳上去這個數據庫文件呢,好尷尬啊,不過不要緊啦,博主是有百度雲的人(瞬間逗比的本質又暴露了),已上傳到http://pan.baidu.com/s/1mivSSRY ,有興趣來作這個實驗的廣大博友能夠試一試,大神就勿噴了,博主是準大三的學生,嘿嘿。sql