Mengapa Borang Di Dalam Panggilan $.load() Gagal Disiarkan dengan Betul, dan Bagaimana AJAX Boleh Menyelesaikan Ini?

Borang Di Dalam $.load Tidak Disiarkan dengan Betul? Penjelasan Terperinci Isu

Ia adalah perkara biasa untuk menghadapi situasi di mana borang yang dibenamkan dalam kawasan yang dimuatkan melalui $.load gagal menyiarkan data dengan betul. Inti masalahnya terletak pada sifat tak segerak $.load, yang memuatkan kandungan ke dalam elemen tertentu tanpa memuatkan semula keseluruhan halaman. Ini boleh membawa kepada percanggahan antara tindakan sasaran borang dan URL sebenar tempat halaman tersebut berada.

Untuk menggambarkan isu tersebut, mari kita pertimbangkan contoh:

<pre class="brush:php;toolbar:false">
    Readthis = "MonsterRequest.php?id=<?php echo $_REQUEST['id']; ?>&amp;Mon=";
    TestVar = TestVar.replace(/\s/g, "");
    Readthis = Readthis + htmlencode(TestVar);
    $('#CenterPiece').load(Readthis); 

Dalam contoh ini, apabila butang diklik, ia melaksanakan kod yang memuatkan kandungan daripada "MonsterRequest.php" ke dalam elemen dengan ID "CenterPiece." Walau bagaimanapun, kerana $.load tidak segerak, penyerahan borang berlaku sebelum kandungan "MonsterRequest.php" dimuatkan sepenuhnya. Ini bermakna borang tersebut diserahkan kepada URL halaman semasa, bukannya kepada URL sasaran yang dimaksudkan yang dinyatakan dalam atribut tindakannya.

Memahami AJAX dan Cara Ia Menyelesaikan Isu

Untuk menyelesaikan isu tersebut , adalah perlu untuk menggunakan AJAX (Asynchronous JavaScript dan XML). AJAX membenarkan halaman web untuk berkomunikasi dengan pelayan secara tidak segerak, tanpa memuatkan semula keseluruhan halaman. Ini memastikan bahawa borang yang dibenamkan dalam kandungan yang dimuatkan secara dinamik boleh menyerahkan data dengan betul kepada sasaran yang dimaksudkan.

Pada dasarnya, AJAX membenarkan anda menghantar data ke fail PHP pada pelayan, memproses data dan mengembalikan respons tanpa memuatkan semula halaman. Aliran kerja adalah seperti berikut:

Fail #1:

<pre class="brush:php;toolbar:false">
    <script>
        $(document).ready(function() {
            $('#Sel').change(function() {
                var opt = $(this).val();
                $.ajax({
                    type: "POST",
                    url: "receiving_file.php",
                    data: 'selected_opt=' + opt,
                    success:function(data){
                        alert('This was sent back: ' + data);
                    }
                });
            });
        });
    </script>

Dalam skrip ini, apabila lungsur turun "Sel" berubah, ia mencetuskan permintaan AJAX. Permintaan dihantar ke "receiving_file.php" dan mengandungi nilai pilihan yang dipilih.

Fail #2: receiving_file.php

<pre class="brush:php;toolbar:false">
    <?php
        $recd = $_POST['selected_opt'];
        echo 'You chose: ' . $recd;
    

Dalam fail PHP ini, data yang diterima disimpan dalam pembolehubah $recd, dan respons digema kembali ke pelanggan.

Keputusan:

Apabila pilihan ditukar dalam "Fail #1," permintaan AJAX dibuat kepada "Fail #2." Data diproses dan respons dihantar semula kepada pelanggan tanpa memuatkan semula halaman.

Atas ialah kandungan terperinci Mengapa Borang Di Dalam Panggilan $.load() Gagal Disiarkan dengan Betul, dan Bagaimana AJAX Boleh Menyelesaikan Ini?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!