Rumah hujung hadapan web tutorial js ajax实现三级联动写法的实例分析

ajax实现三级联动写法的实例分析

Oct 30, 2017 am 10:36 AM
ajax Kaedah penulisan Perkaitan

主页面代码

<!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: &#39;post&#39;,   //发送请求的方法(get)        
        url: &#39;sheng_l.php&#39;,//发送请求的地址        
        success: function (data) {//发送成功时的回调函数
    //            console.log(data);
            for (var i in data) {
                $("#sheng").append("<option value=&#39;"+ data[i][2] +"&#39;>" + 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=&#39;" + data[i][2] +"&#39;>" + 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=&#39;" +data[i][2] +"&#39;>" +data[i][1] +"</option>")
                    }
                }
            })
        })
    })
Salin selepas log masuk

处理页面代码

<?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[&#39;parent_id&#39;]}";$result = $db->Query($sql);echo json_encode($result);
Salin selepas log masuk

Atas ialah kandungan terperinci ajax实现三级联动写法的实例分析 . Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Animasi klasik Zhengtu IPx 'Perjalanan ke Barat' Perjalanan ke barat adalah tanpa rasa takut dan tanpa rasa takut Animasi klasik Zhengtu IPx 'Perjalanan ke Barat' Perjalanan ke barat adalah tanpa rasa takut dan tanpa rasa takut Jun 10, 2024 pm 06:15 PM

Kembara melalui keluasan dan jejakkan kaki ke perjalanan ke barat! Hari ini, Zhengtu IP secara rasmi mengumumkan bahawa ia akan melancarkan kerjasama rentas sempadan dengan animasi CCTV "Journey to the West" untuk bersama-sama mencipta pesta kebudayaan yang menggabungkan tradisi dan inovasi! Kerjasama ini bukan sahaja menandakan kerjasama yang mendalam antara dua jenama klasik domestik utama, tetapi juga menunjukkan usaha yang tidak putus-putus dan kegigihan siri Journey dalam mempromosikan budaya tradisional Cina. Sejak kelahirannya, siri Zhengtu telah digemari oleh pemain kerana warisan budaya yang mendalam dan permainan yang pelbagai. Dari segi warisan budaya, siri Zhengtu sentiasa mengekalkan rasa hormat dan cinta kepada budaya tradisional Cina, dan menyepadukan unsur budaya tradisional dengan mahir ke dalam permainan, membawa lebih keseronokan dan inspirasi kepada pemain. Animasi CCTV "Journey to the West" adalah klasik yang mengiringi pertumbuhan generasi.

Bagaimana untuk menyelesaikan ralat 403 yang dihadapi oleh permintaan jQuery AJAX Bagaimana untuk menyelesaikan ralat 403 yang dihadapi oleh permintaan jQuery AJAX Feb 20, 2024 am 10:07 AM

Tajuk: Kaedah dan contoh kod untuk menyelesaikan ralat 403 dalam permintaan AJAX jQuery Ralat 403 merujuk kepada permintaan bahawa pelayan melarang akses kepada sumber Ralat ini biasanya berlaku kerana permintaan itu tidak mempunyai kebenaran atau ditolak oleh pelayan. Apabila membuat permintaan jQueryAJAX, anda kadangkala menghadapi situasi ini Artikel ini akan memperkenalkan cara menyelesaikan masalah ini dan memberikan contoh kod. Penyelesaian: Semak kebenaran: Mula-mula pastikan alamat URL yang diminta adalah betul dan sahkan bahawa anda mempunyai kebenaran yang mencukupi untuk mengakses sumber tersebut.

PHP dan Ajax: Membina enjin cadangan autolengkap PHP dan Ajax: Membina enjin cadangan autolengkap Jun 02, 2024 pm 08:39 PM

Bina enjin cadangan autolengkap menggunakan PHP dan Ajax: Skrip sisi pelayan: mengendalikan permintaan Ajax dan mengembalikan cadangan (autocomplete.php). Skrip pelanggan: Hantar permintaan Ajax dan cadangan paparan (autocomplete.js). Kes praktikal: Sertakan skrip dalam halaman HTML dan nyatakan pengecam elemen input carian.

Bagaimana untuk menyelesaikan ralat permintaan jQuery AJAX 403 Bagaimana untuk menyelesaikan ralat permintaan jQuery AJAX 403 Feb 19, 2024 pm 05:55 PM

jQuery ialah perpustakaan JavaScript popular yang digunakan untuk memudahkan pembangunan sisi klien. AJAX ialah teknologi yang menghantar permintaan tak segerak dan berinteraksi dengan pelayan tanpa memuatkan semula keseluruhan halaman web. Walau bagaimanapun, apabila menggunakan jQuery untuk membuat permintaan AJAX, anda kadangkala menghadapi 403 ralat. Ralat 403 biasanya ralat akses yang dinafikan pelayan, mungkin disebabkan oleh dasar keselamatan atau isu kebenaran. Dalam artikel ini, kami akan membincangkan cara menyelesaikan permintaan jQueryAJAX yang menghadapi ralat 403

Bagaimana untuk menyelesaikan masalah jQuery AJAX ralat 403? Bagaimana untuk menyelesaikan masalah jQuery AJAX ralat 403? Feb 23, 2024 pm 04:27 PM

Bagaimana untuk menyelesaikan masalah jQueryAJAX ralat 403? Apabila membangunkan aplikasi web, jQuery sering digunakan untuk menghantar permintaan tak segerak. Walau bagaimanapun, kadangkala anda mungkin menghadapi kod ralat 403 apabila menggunakan jQueryAJAX, menunjukkan bahawa akses dilarang oleh pelayan. Ini biasanya disebabkan oleh tetapan keselamatan bahagian pelayan, tetapi terdapat cara untuk mengatasinya. Artikel ini akan memperkenalkan cara menyelesaikan masalah ralat jQueryAJAX 403 dan memberikan contoh kod khusus. 1. membuat

Ayam goreng adalah perniagaan yang hebat dan tiada ruang untuk kesilapan! 'Backwater Cold' menghubungkan dengan KFC, menyebabkan pemain 'menari apabila mendengar ayam' Ayam goreng adalah perniagaan yang hebat dan tiada ruang untuk kesilapan! 'Backwater Cold' menghubungkan dengan KFC, menyebabkan pemain 'menari apabila mendengar ayam' Apr 17, 2024 pm 06:34 PM

Pada tarikh itu, "Backwater Cold" secara rasmi mengumumkan bahawa ia akan melancarkan hubungan dengan KFC dari 19 April hingga 12 Mei, namun kandungan khusus pautan itu telah membuatkan ramai orang terpegun. Mereka berulang kali berkata "Memalukan syurga" dan " Ia penting kepada masyarakat." meninggal dunia"! Sebabnya terletak pada slogan acara bertema ini Rakan-rakan yang pernah melihat jalinan KFC iaitu "Genshin Impact" dan "Beng Tie" pasti mempunyai tanggapan bahawa "bertemu dunia lain dan menikmati makanan yang lazat" telah menjadi kenyataan dalam "Ni Shui. Han" Sekarang: berteriak kepada kerani, "Tuhan sedang menyiasat kes ini, siapakah kamu?" Kerani itu perlu menjawab, "Ayam goreng adalah perniagaan yang besar, dan tidak ada ruang untuk kesilapan!" Panduan latihan untuk pekerja: Jangan pernah ketawa! Bukan itu sahaja, kerjasama ini turut mengadakan pertandingan tarian Jika anda pergi ke kedai tema dan mempersembahkan gerak tari "Dance when you hear 'Ji'", anda juga boleh mendapatkan stand muzik goyang kecil. Memalukan, sangat memalukan! Tetapi itulah yang saya mahu

Bagaimana untuk mendapatkan pembolehubah daripada kaedah PHP menggunakan Ajax? Bagaimana untuk mendapatkan pembolehubah daripada kaedah PHP menggunakan Ajax? Mar 09, 2024 pm 05:36 PM

Menggunakan Ajax untuk mendapatkan pembolehubah daripada kaedah PHP adalah senario biasa dalam pembangunan web Melalui Ajax, halaman boleh diperoleh secara dinamik tanpa menyegarkan data. Dalam artikel ini, kami akan memperkenalkan cara menggunakan Ajax untuk mendapatkan pembolehubah daripada kaedah PHP, dan memberikan contoh kod khusus. Pertama, kita perlu menulis fail PHP untuk mengendalikan permintaan Ajax dan mengembalikan pembolehubah yang diperlukan. Berikut ialah kod contoh untuk fail PHP mudah getData.php:

Ekstasi chef berganda! Kerjasama 'Onmyoji' x 'Hatsune Miku' bermula pada 6 Mac Ekstasi chef berganda! Kerjasama 'Onmyoji' x 'Hatsune Miku' bermula pada 6 Mac Feb 22, 2024 pm 06:52 PM

Permainan mudah alih "Onmyoji" NetEase hari ini mengumumkan bahawa kerjasama terhad Onmyoji x Hatsune Miku akan bermula secara rasmi pada 6 Mac. SSR Hatsune Miku terhad kerjasama (CV: Saki Fujita) dan SSR Kagamine Rin (CV: Asami Shimoda) akan datang ke Heian Kyo! Acara persembahan istimewa dalam talian pautan akan bermula secara rasmi dalam permainan pada 9 Mac~

See all articles