ajax 三級聯動寫法

来源:http://www.cnblogs.com/dej-11/archive/2017/10/30/7753176.html
-Advertisement-
Play Games

主頁面代碼 處理頁面代碼 ...


主頁面代碼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../wenjian/jquery-2.2.3.min.js"></script>
</head>
<body>
<select id="sheng">
    <option>請選擇</option>
</select>
<select id="shi">
    <option >請選擇</option>
</select>
<select id="qu">
    <option >請選擇</option>
</select>
</body>
</html>
<script>
    $.ajax({
        data: {parent_id: 0}, //發送的數據
        dataType: "json", //返回值的類型 text為string型
        type: 'post',   //發送請求的方法(get)
        url: 'sheng_l.php',//發送請求的地址
        success: function (data) {//發送成功時的回調函數
    //            console.log(data);
            for (var i in data) {
                $("#sheng").append("<option value='"+ data[i][2] +"'>" + data[i][1]  +"</option>")
            }
        }
    })
    $(document).ready(function () {
        $("#sheng").change(function () {
            $("#shi").get(0).options.length= 1;
//            $("#qu").get(0).options.length= 1;
            var data = $("#sheng").find("option:selected").val();
            $.ajax({
                data:{parent_id:data},
                type:"post",
                dataType:"json",
                url:"sheng_l.php",
                success:function (data) {
                    for(var i in data){
                        $("#shi").append("<option value='" + data[i][2] +"'>" + data[i][1] +"</option>")
                    }
                }
            })
        })
    })
    $(document).ready(function () {
        $("#shi").change(function () {
            $("#qu").get(0).options.length= 1;
            var data = $("#shi").find("option:selected").val();
            $.ajax({
                data:{parent_id:data},
                type:"post",
                dataType:"json",
                url:"sheng_l.php",
                success:function (data) {
                    for (var i in data){
                        $("#qu").append("<option value='" +data[i][2] +"'>" +data[i][1] +"</option>")
                    }
                }
            })
        })
    })

處理頁面代碼

<?php
/**
 * Created by fcc
 * User: Administrator
 * Date: 2017/10/29
 * Time: 20:56
 */
require_once "../wenjian/DBDA.class.php";
$db = new DBDA();
$sql = "select * from region WHERE father_id = {$_POST['parent_id']}";
$result = $db->Query($sql);
echo json_encode($result);

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 什麼是單點登錄? 我想肯定有一部分人“望文生義”的認為單點登錄就是一個用戶只能在一處登錄,其實這是錯誤的理解(我記得我第一次也是這麼理解的)。 單點登錄指的是多個子系統只需要登錄一個,其他系統不需要登錄了(一個瀏覽器內)。一個子系統退出,其他子系統也全部是退出狀態。 如果你還是不明白,我們舉個實際的 ...
  • 用於進行遷移的 Entity Framework Core NuGet 包 註意:必須通過編輯 .csproj 文件來安裝此包;不能使用 install-package 命令或程式包管理器 GUI。 你可以編輯.csproj通過右鍵單擊中的項目名稱的文件解決方案資源管理器並選擇編輯 <ItemGro ...
  • 一、摘要 一說到ADO.NET大家可能立刻想到的就是增、刪、改、查(CRUD)操作,然後再接就想到項目中的SQLHelper。沒錯本課分享課阿笨給大家帶來的是來源於github上開源的DAO資料庫訪問組件DBHelpers。如果您對本次分享《.NET輕量級DBHelpers數據訪問組件》課程感興趣的 ...
  • 業務背景 在稍微複雜點業務系統中,不可避免會碰到做定時任務的需求,比如淘寶的交易超時自動關閉訂單、超時自動確認收貨等等。對於一些定時作業比較多的系統,通常都會搭建專門的調度平臺來管理,通過創建定時器來周期性執行任務。如剛纔所說的場景,我們可以給訂單創建一個專門的任務來處理交易狀態,每秒輪詢一次訂單表 ...
  • 有了SpringMVC和Mabatis的整合後,一個初步WEB框架就形成了,但是完整的SSM框架還需要Spring的支持! 目前為止,我們所添加的配置文件有核心配置文件web.xml,springmvc的配置文件spring-servlet.xml以及Mabatis的配置文件mybatis-conf ...
  • 前言 今天在掘金看到一篇關於講解的Spring框架的文章,文章提到了牛客網的面試題。於是乎我就下載了牛客網app,發現面試題目很豐富。我就挑了java方面的面試題做了一下。10個題目為一組面試題,做完後,我發現了自己錯了好多,大多數都是基礎題。俗話說:基礎的深度決定未來的高度。我感覺自己必須要做一個 ...
  • 公司自己塔建的半自動化代碼生成項目 用法: 把csv文件放到src/resources/csv下,運行GenMain.java,生成的代碼在target/output下。 對GenMain.java進行適當的修改,可以控制生成的代碼有哪些,Pojo,Dao,Srv,ISrv,Action,PageJ ...
  • yii2在使用的時候,訪問控制器的時候,如果控制器的名稱是駝峰命名法,那訪問的url中要改成橫線的形式。例如: 最近在做某渠道的直連的時候,他們提供的文檔上明確指出介面的形式: 剛開始以為YII2中肯定有這樣的設置,然後就去google了下,發現都說不行,自己去看了下,果然,框架裡面直接是寫死的:( ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...