hujung hadapan web
tutorial js
Penjelasan terperinci tentang contoh kaedah load() dan post() ajax dalam jQuery_jquery
Penjelasan terperinci tentang contoh kaedah load() dan post() ajax dalam jQuery_jquery
Contoh dalam artikel ini menerangkan kaedah load() dan post() ajax dalam jQuery. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:
1. kaedah muat()
Kaedah load() jQuery ajax boleh memuatkan kod fail HTML jauh dan memasukkannya ke dalam DOM Ini masih berbeza sedikit daripada post and get, tetapi ia boleh memuatkan html halaman dan menyimpannya dengan cepat DOM dan boleh laku.
Kaedah load() menggunakan kaedah GET secara lalai Jika parameter data diluluskan, kaedah Post digunakan.
Tukar kepada mod POST secara automatik apabila menghantar parameter tambahan. Dalam jQuery 1.2, anda boleh menentukan pemilih untuk menapis dokumen HTML yang dimuatkan, dan hanya kod HTML yang ditapis akan dimasukkan ke dalam DOM. Sintaks adalah seperti "url #some > selector", pemilih lalai ialah "body>*".
Penjelasan:
load ialah fungsi Ajax yang paling mudah, tetapi penggunaannya mempunyai had:
1. Ia digunakan terutamanya untuk antara muka Ajax yang secara langsung mengembalikan HTML
2. Muatkan ialah kaedah pembungkus jQuery yang perlu dipanggil pada pembungkus jQuery dan akan memuatkan HTML yang dikembalikan ke dalam objek Walaupun fungsi panggil balik ditetapkan, tidak dapat dinafikan bahawa antara muka beban direka dengan bijak dan mudah digunakan. Berikut ialah contoh: Tunjukkan penggunaan antara muka Muatkan:
fungsi beban():
Pengenalan fungsi: muat(url, [data], [panggilan balik]) Nilai pulangan: jQuery
Perihalan parameter:
url: URL halaman web HTML untuk dimuatkan.
data: (parameter pilihan) data kunci/nilai dihantar ke pelayan.
panggil balik: (parameter pilihan) fungsi panggil balik apabila pemuatan berjaya.
Contoh demonstrasi diberikan di bawah:
Mula-mula buat fail test.html yang perlu dimuatkan:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>ajax演示</title> </head> <body> 脚本之家(www.jb51.net),提供大量脚本及素材供大家下载! </body> </html>
Kemudian buat fail ajax.html dan ingat untuk memperkenalkan jquery.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="./jquery-1.7.1.min.js"></script>
<script>
$(document).ready(function(){
$("#btn").click(function(){
$("#result").load("test.html",function(responseText,textStatus){
$("#display").append("<hr>responseText:"+responseText);
$("#display").append("<hr>textStatus:"+textStatus);
});
});
});
</script>
</head>
<body>
<input type="button" value="测试" id="btn" />
<h2>显示的内容如下：</h2>
<div id="result"></div>
<h2>结果：</h2>
<div id="display"></div>
</body>
</html>
Contoh di atas menunjukkan cara menggunakan kaedah Muat.
Petua:
① Kita mesti sentiasa memberi perhatian kepada caching penyemak imbas Apabila menggunakan kaedah GET, kita mesti menambah parameter cap waktu (net Date()).getTime() untuk memastikan URL yang dihantar adalah berbeza setiap kali untuk mengelakkan cache penyemak imbas.
② Apabila ruang ditambahkan selepas parameter url, seperti " ", ralat "simbol tidak dikenali" akan muncul dan permintaan masih boleh dihantar secara normal Namun, HTML tidak boleh dimuatkan ke dalam DOM diselesaikan selepas memadamkannya.
2. kaedah post()
Ajax dalam jquery mempunyai dua mod penghantaran data, satu ialah get(), yang disebut dalam artikel sebelumnya, dan satu lagi ialah post(). Izinkan saya memperkenalkannya kepada anda sekali lagi. Rakan-rakan yang ingin mengetahui lebih lanjut boleh merujuknya.
Pertama sekali, anda perlu tahu jQuery.post(url, [data], [panggilan balik], [type])
Terangkan parameter:
url: Hantar alamat permintaan.
data: Parameter kunci/nilai untuk dihantar.
panggil balik: fungsi panggil balik apabila menghantar berjaya.
jenis: Kembalikan format kandungan, xml, html, skrip, json, teks, _default.
Penerangan:
Muat maklumat melalui permintaan HTTP POST jauh.
Ini ialah fungsi permintaan POST yang mudah untuk menggantikan kompleks $.ajax. Fungsi panggil balik boleh dipanggil apabila permintaan berjaya. Jika anda perlu melaksanakan fungsi pada ralat, gunakan $.ajax.
Mari kita lihat contoh mudah dahulu
Kemudian buat fail ajax.html, perhatikan kod js:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="./jquery-1.7.1.min.js"></script>
<script>
$(document).ready(function(){
$("#sub").click(function(){
$.post("testPost.php",{name:$("#name").val()},function(data,textStatus){
$("#result").append("data:"+data.name);
$("#result").append("<br>textStatus:"+textStatus);
},"json");
return false;
});
});
</script>
</head>
<body>
<form action="testPost.php" method="post">
<input type="text" name="name" id="name" >
<input type="submit" id="sub" value="提交">
</form>
<h2>显示的内容如下：</h2>
<div id="result"></div>
</body>
</html>
Penggunaan 2: (Klik data siaran untuk mengembalikan data)
<input type="button" id="bnajax" value="ajax" onclick="ajaxTest()" />
<script type="text/javascript" >
function ajaxTest()
{
$.post("http://localhost:8012/t.asp", { "txt": "123" },function(data)
{
$("#divMsg").html(data);
}
);
}
</script>
Contoh 3
Kod JS:
<script>
$(document).ready(function(){
$(".ajax_btn").click(function(){
$.post("ajax.php",//异步处理动态页面
{name:$(".name").val()},//获取类名为"name"文本的值，以NAME异步传值
function(data){//data为反回值，function进行反回值处理
$(".content").val(data);//获得得反回值后，将其填入到类名为"content"的文本框中
});
})
})
</script>
kod ajax.php:
<?php
$name=$_POST["name"];
if($name=="netxu"){
echo "对不起，".$name."数据存在";
}
else{
echo "恭喜你，".$name."可以使用";
}
?>
Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
1389
52
Bagaimana untuk menggunakan kaedah permintaan PUT dalam jQuery?
Feb 28, 2024 pm 03:12 PM
Bagaimana untuk menggunakan kaedah permintaan PUT dalam jQuery? Dalam jQuery, kaedah menghantar permintaan PUT adalah serupa dengan menghantar jenis permintaan lain, tetapi anda perlu memberi perhatian kepada beberapa butiran dan tetapan parameter. Permintaan PUT biasanya digunakan untuk mengemas kini sumber, seperti mengemas kini data dalam pangkalan data atau mengemas kini fail pada pelayan. Berikut ialah contoh kod khusus menggunakan kaedah permintaan PUT dalam jQuery. Mula-mula, pastikan anda memasukkan fail perpustakaan jQuery, kemudian anda boleh menghantar permintaan PUT melalui: $.ajax({u
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 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:
Petua jQuery: Cepat ubah suai teks semua teg pada halaman
Feb 28, 2024 pm 09:06 PM
Tajuk: Petua jQuery: Cepat ubah suai teks semua teg pada halaman Dalam pembangunan web, kita selalunya perlu mengubah suai dan mengendalikan elemen pada halaman. Apabila menggunakan jQuery, kadangkala anda perlu mengubah suai kandungan teks semua teg dalam halaman sekaligus, yang boleh menjimatkan masa dan tenaga. Berikut akan memperkenalkan cara menggunakan jQuery untuk mengubah suai teks semua teg pada halaman dengan cepat, dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan fail perpustakaan jQuery dan memastikan bahawa kod berikut dimasukkan ke dalam halaman: <
Bagaimana untuk melaksanakan PHP untuk melompat ke halaman dan membawa data POST
Mar 22, 2024 am 10:42 AM
PHP ialah bahasa pengaturcaraan yang digunakan secara meluas dalam pembangunan laman web, dan lompat halaman dan membawa data POST adalah keperluan biasa dalam pembangunan laman web. Artikel ini akan memperkenalkan cara melaksanakan lompat halaman PHP dan membawa data POST, termasuk contoh kod khusus. Dalam PHP, lompatan halaman biasanya dilaksanakan melalui fungsi pengepala. Jika anda perlu membawa data POST semasa proses lompatan, anda boleh melakukannya melalui langkah berikut: Pertama, buat halaman yang mengandungi borang, di mana pengguna mengisi maklumat dan mengklik butang hantar. Acti dalam borang
Gunakan jQuery untuk mengubah suai kandungan teks semua teg
Feb 28, 2024 pm 05:42 PM
Tajuk: Gunakan jQuery untuk mengubah suai kandungan teks semua teg jQuery ialah perpustakaan JavaScript yang popular yang digunakan secara meluas untuk mengendalikan operasi DOM. Dalam pembangunan web, kita sering menghadapi keperluan untuk mengubah suai kandungan teks tag pautan (tag) pada halaman. Artikel ini akan menerangkan cara menggunakan jQuery untuk mencapai matlamat ini dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan perpustakaan jQuery ke dalam halaman. Tambahkan kod berikut dalam fail HTML:
Contoh kod PHP: Cara menggunakan POST untuk lulus parameter dan melaksanakan lompatan halaman
Mar 07, 2024 pm 01:45 PM
Tajuk: Contoh kod PHP: Cara menggunakan POST untuk lulus parameter dan melaksanakan lompatan halaman Dalam pembangunan web, ia selalunya melibatkan keperluan untuk lulus parameter melalui POST dan memprosesnya di bahagian pelayan untuk melaksanakan lompatan halaman. PHP, sebagai bahasa skrip sebelah pelayan yang popular, menyediakan pelbagai fungsi dan sintaks untuk mencapai tujuan ini. Berikut akan memperkenalkan cara menggunakan PHP untuk melaksanakan fungsi ini melalui contoh praktikal. Pertama, kita perlu menyediakan dua halaman, satu untuk menerima permintaan POST dan parameter proses
PHP lwn. Ajax: Penyelesaian untuk mencipta kandungan yang dimuatkan secara dinamik
Jun 06, 2024 pm 01:12 PM
Ajax (JavaScript Asynchronous dan XML) membenarkan menambah kandungan dinamik tanpa memuatkan semula halaman. Menggunakan PHP dan Ajax, anda boleh memuatkan senarai produk secara dinamik: HTML mencipta halaman dengan elemen kontena dan permintaan Ajax menambah data pada elemen selepas memuatkannya. JavaScript menggunakan Ajax untuk menghantar permintaan kepada pelayan melalui XMLHttpRequest untuk mendapatkan data produk dalam format JSON daripada pelayan. PHP menggunakan MySQL untuk menanyakan data produk daripada pangkalan data dan mengekodnya ke dalam format JSON. JavaScript menghuraikan data JSON dan memaparkannya dalam bekas halaman. Mengklik butang mencetuskan permintaan Ajax untuk memuatkan senarai produk.
