• ajax 三级联动写法


    主页面代码

    <!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);
  • 相关阅读:
    Path Sum
    Binary Tree Level Order Traversal II
    Jump Game
    leedcode 刷题-V2
    (2016 年) githup 博客地址 : https://github.com/JMWY/MyBlog
    算法分类总结
    剑指 Offer 题目汇总索引
    LeedCde 题解目录
    趣味算法总目录
    常用
  • 原文地址:https://www.cnblogs.com/dej-11/p/7753176.html
Copyright © 2020-2023  润新知