详细为你解析AJAX的使用方法(代码贴上)
下面是我给大家整理的AJAX的使用方法，有兴趣的同学可以去看看。
HTTPS
"/jsontest/randomdata/" // there was a missing trailing /// i.e. // was going to https://larsendt.com/jsontest/randomdata/?ymax=500&count=32&t=0.96041791105086431234
GET请求
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html>
<head>
<title>新建网页</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript">
function checkname(){
//ajax校验用户名
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
document.getElementById('result').innerHTML = xhr.responseText;
}
} //获得输入的用户名，并传递个服务器端
var ming = document.getElementById('username').value; //对ming变量的特殊符号信息进行编码
ming = encodeURIComponent(ming);
xhr.open('get','./04.php?nm='+ming+'&age=23', true); //xhr.open第三个参数默认异步请求为true, 改成同步请求为false;
xhr.send(null);
} </script>
</head>
<body>
<h2>ajax之get形式请求</h2>
<p>用户名：<input type="text" id="username" onblur="checkname()" /></p>
<p>密码：<input type="password" id="userpwd" /></p>
<p id="result"></p>
</body></html>12345678910111213141516171819202122232425262728293031323334353637POST请求
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html>
<head>
<title>新建网页</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript">
function checkname(){
//ajax校验用户名
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
document.getElementById('result').innerHTML = xhr.responseText;
}
}
xhr.open('post','./05.php?height=165', true); //默认为true异步请求, false为同步请求
//post请求需要把数据组织为xml格式
//以下方法必须要在"open"方法后进行设置
xhr.setRequestHeader("content-type","application/x-www-form-urlencoded"); //获得输入的用户名，并传递个服务器端
var ming = document.getElementById('username').value; //对ming变量的特殊符号信息进行编码
ming = encodeURIComponent(ming); //把传递的参数变为"请求字符串"传递给send方法
var info = "nm="+ming+"&age=20";
xhr.send(info);
} </script>
</head>
<body>
<h2>ajax之post形式请求</h2>
<p>用户名：<input type="text" id="username" onblur="checkname()" /></p>
<p>密码：<input type="password" id="userpwd" /></p>
<p id="result"></p>
</body></html>123456789101112131415161718192021222324252627282930313233343536373839404142FormDate收集表单数据
<!DOCTYPE html><html><head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript" src="common.js"></script></head><body>
<form>
<p>用户名：<input type="text" name="user"></p>
<p>密 码：<input type="password" name="pwd"></p>
<p>邮 箱：<input type="text" name="email"></p>
<p>头 像：<input type="file" name="userpic"></p>
<p><input type="button" value="提交" id="btn"></p>
</form>
<script type="text/javascript">
//form表单节点对象
var oForm = document.getElementsByTagName('form')[0]; //按钮
var oBtn = $('btn');
oBtn.onclick = function(){
//先收集输入框的内容
var user = document.getElementsByName('user')[0].value; var pwd = document.getElementsByName('pwd')[0].value; var email = document.getElementsByName('email')[0].value; //通过ajax提交到服务器
var xhr; try{
xhr = new XMLHttpRequest();
}catch(e){
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}
xhr.open('POST','upload.php',true); //实例化表单对象，获得表单里面的输入框的内容（主流浏览器支持）
//参数就是表单节点对象
var data = new FormData(oForm);
xhr.send(data);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status==200){
console.log(xhr.responseText);
}
}
} </script></body></html>123456789101112131415161718192021222324252627282930313233343536373839404142434445464748AJAX跨域
//放在被访问资源上 <?php header('Access-Control-Allow-Origin:http://A.abc.com'); ?> 12
jasonP
//在客户端定义函数,在服务端定义调用函数和传入参数,请求时传入调用参数内容,服务端就用客户端传入的函数名为调用函数名(可变函数); //<script src=xxx.kuaiyu.com/xxx.php></script> https://xxx.cc.com/xx.php?param=xxx&function_name=function_name//百度标准接口 https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=法国大选&cb=demo12345
JQUERY AJAX
语法:
$.get(url,data,function(),dataType)
url:请求的文件。
data:传递数据。
function(responseText,statusText,xhr):返回函数.
responseText:返回的文本。
statusText:返回的状态值。
status 包含请求的状态
（”success”、”notmodified”、”error”、”timeout”、”parsererror”）
xhr:XMLHttpRequest()请求对象。
datatype:
“xml” - 一个 XML 文档
“html” - HTML 作为纯文本
“text” - 纯文本字符串
“script” - 以 JavaScript 运行响应，并以纯文本返回
“json” - 以 JSON 运行响应，并以 JavaScript 对象返回
“jsonp” - 使用 JSONP 加载一个 JSON 块，将添加一个 “?callback=?” 到 URL 来规定回调
.get(),.get(),.post() //post与get参数无异
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>JQuery Collapse</title><SCRIPT LANGUAGE="JavaScript" src="jquery-3.1.1.js"></SCRIPT><script type="text/javascript">$(function(){
$('#bt1').click(function(){
var username = $('input[name=username]').val();//获取用户名的值
var pwd = $('input[name=password]').val();//获取密码的值
$.get( 'get.php',//url
{username:username,pwd:pwd},//$_GET['username']:请求的数据
function(res,sta,xhr){//回调函数
//res:返回值
//sta:返回的状态
//xhr:请求的对象XMLHttprequest
// alert('返回值是：'+res);
if(sta == 'success'){
$('span').html(res);
}
}
)
});
});</script>
<style type="text/css"></style>
</head>
<body>用户名：<input type="text" name='username' /><span></span><br>
密码：<input type="password" name='password' /><br>
<input type="button" id="bt1" value="发送请求" />
</body>
</html>1234567891011121314151617181920212223242526272829303132333435363738394041$.ajax()
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>JQuery Collapse</title><SCRIPT LANGUAGE="JavaScript" src="jquery-3.1.1.js"></SCRIPT><script type="text/javascript">$(function(){
$('input[name=username]').keyup(function(){
var username = $('input[name=username]').val();//获取用户名的值
var pwd = $('input[name=password]').val();//获取密码的值
$.ajax({
url:'post.php',
data:{username:username,pwd:pwd},
dataType:'html',
type:'post',
success:function(mydata){
$('span').html(mydata);
}
})
});
});</script>
<style type="text/css"></style>
</head>
<body>
用户名：<input type="text" name='username' /><span></span><br>
密码：<input type="password" name='password' /><br>
<input type="button" id="bt1" value="发送请求" />
</body>
</html>上面是我整理给大家的AJAX的使用方法，希望今后会对大家有帮助。
相关文章：
Atas ialah kandungan terperinci 详细为你解析AJAX的使用方法(代码贴上). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
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
AI Hentai Generator
Menjana ai hentai secara percuma.
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
1374
52
Bagaimana untuk menggunakan alat pembaikan DirectX? Penggunaan terperinci alat pembaikan DirectX
Mar 15, 2024 am 08:31 AM
Alat pembaikan DirectX ialah alat sistem profesional Fungsi utamanya adalah untuk mengesan status DirectX sistem semasa Jika keabnormalan ditemui, ia boleh dibaiki secara langsung. Mungkin terdapat ramai pengguna yang tidak tahu cara menggunakan alat pembaikan DirectX Mari kita lihat tutorial terperinci di bawah. 1. Gunakan perisian alat pembaikan untuk melakukan pengesanan pembaikan. 2. Jika ia menggesa bahawa terdapat masalah tidak normal dalam komponen C++ selepas pembaikan selesai, sila klik butang Batal dan kemudian klik bar menu Alat. 3. Klik butang Pilihan, pilih sambungan, dan klik butang Mulakan Sambungan. 4. Selepas pengembangan selesai, mengesan semula dan membaikinya. 5. Jika masalah masih tidak diselesaikan selepas operasi alat pembaikan selesai, anda boleh cuba menyahpasang dan memasang semula program yang melaporkan ralat.
Penjelasan terperinci tentang ralat Oracle 3114: Cara menyelesaikannya dengan cepat
Mar 08, 2024 pm 02:42 PM
Penjelasan terperinci tentang ralat Oracle 3114: Bagaimana untuk menyelesaikannya dengan cepat, contoh kod khusus diperlukan Semasa pembangunan dan pengurusan pangkalan data Oracle, kami sering menghadapi pelbagai ralat, antaranya ralat 3114 adalah masalah yang agak biasa. Ralat 3114 biasanya menunjukkan masalah dengan sambungan pangkalan data, yang mungkin disebabkan oleh kegagalan rangkaian, pemberhentian perkhidmatan pangkalan data atau tetapan rentetan sambungan yang salah. Artikel ini akan menerangkan secara terperinci punca ralat 3114 dan cara menyelesaikan masalah ini dengan cepat, dan melampirkan kod tertentu
Cara menggunakan Baidu Netdisk-Cara menggunakan Baidu Netdisk
Mar 04, 2024 pm 09:28 PM
Ramai rakan masih tidak tahu cara menggunakan Baidu Netdisk, jadi editor akan menerangkan cara menggunakan Baidu Netdisk di bawah Jika anda memerlukan, cepat dan lihat. Langkah 1: Log masuk terus selepas memasang Baidu Netdisk (seperti yang ditunjukkan dalam gambar Langkah 2: Kemudian pilih "Perkongsian Saya" dan "Senarai Pemindahan" mengikut arahan halaman (seperti yang ditunjukkan dalam gambar); Perkongsian Rakan", anda boleh berkongsi gambar dan fail terus dengan rakan (seperti yang ditunjukkan dalam gambar); Langkah 4: Kemudian pilih "Kongsi" dan kemudian pilih fail komputer atau fail cakera rangkaian (seperti yang ditunjukkan dalam gambar); Langkah Kelima 1: Kemudian anda boleh mencari rakan (seperti yang ditunjukkan dalam gambar) Langkah 6: Anda juga boleh mencari fungsi yang anda perlukan dalam "Function Treasure Box" (seperti yang ditunjukkan dalam gambar). Perkara di atas adalah pendapat editor
Apakah alat pengaktifan KMS? Bagaimana untuk menggunakan alat pengaktifan KMS? Bagaimana untuk menggunakan alat pengaktifan KMS?
Mar 18, 2024 am 11:07 AM
Alat Pengaktifan KMS ialah alat perisian yang digunakan untuk mengaktifkan produk Microsoft Windows dan Office. KMS ialah singkatan kepada KeyManagementService, iaitu perkhidmatan pengurusan utama. Alat pengaktifan KMS mensimulasikan fungsi pelayan KMS supaya komputer boleh menyambung ke pelayan KMS maya untuk mengaktifkan produk Windows dan Office. Alat pengaktifan KMS bersaiz kecil dan berkuasa dalam fungsi Ia boleh diaktifkan secara kekal dengan satu klik Ia boleh mengaktifkan mana-mana versi sistem tetingkap dan mana-mana versi perisian Office tanpa disambungkan ke Internet dan alat pengaktifan Windows yang kerap dikemas kini Hari ini saya akan memperkenalkannya Biar saya memperkenalkan kepada anda kerja pengaktifan kms
Cara menggunakan alat pengaktifan Xiaoma win7 - Cara menggunakan alat pengaktifan Xiaoma win7
Mar 04, 2024 pm 06:16 PM
Saya percaya bahawa ramai pengguna menggunakan alat pengaktifan Xiaoma win7, tetapi adakah anda tahu cara menggunakan alat pengaktifan Xiaoma win7 Kemudian, editor akan membawakan kepada anda cara menggunakan alat pengaktifan Xiaoma win7 Bagi mereka yang berminat dengan ini? sila ke artikel berikut Jom lihat. Langkah pertama ialah pergi ke "Komputer Saya" selepas memasang semula sistem, klik "System Properties" di menu atas, dan semak status pengaktifan Windows. Dalam langkah kedua, klik untuk memuat turun alat pengaktifan win7 dalam talian dan klik untuk membukanya (terdapat banyak sumber tersedia di mana-mana). Langkah ketiga ialah membuka alat pengaktifan Xiaoma dan klik "Aktifkan Windows secara kekal". Langkah keempat ialah menunggu proses pengaktifan selesai pengaktifan. Langkah 5: Semak status pengaktifan Windows sekali lagi dan ketahui bahawa sistem telah diaktifkan.
Analisis makna dan penggunaan titik tengah dalam PHP
Mar 27, 2024 pm 08:57 PM
[Analisis makna dan penggunaan titik tengah dalam PHP] Dalam PHP, titik tengah (.) ialah operator yang biasa digunakan untuk menyambung dua rentetan atau sifat atau kaedah objek. Dalam artikel ini, kami akan menyelami makna dan penggunaan titik tengah dalam PHP, menggambarkannya dengan contoh kod konkrit. 1. Operator titik tengah rentetan Concatenate Penggunaan yang paling biasa dalam PHP adalah untuk menggabungkan dua rentetan. Dengan meletakkan . antara dua rentetan, anda boleh menyambungkannya untuk membentuk rentetan baharu. $string1=&qu
Analisis ciri baharu Win11: Bagaimana untuk melangkau log masuk ke akaun Microsoft
Mar 27, 2024 pm 05:24 PM
Analisis ciri baharu Win11: Cara melangkau log masuk ke akaun Microsoft Dengan keluaran Windows 11, ramai pengguna mendapati ia membawa lebih banyak kemudahan dan ciri baharu. Walau bagaimanapun, sesetengah pengguna mungkin tidak suka sistem mereka terikat pada akaun Microsoft dan ingin melangkau langkah ini. Artikel ini akan memperkenalkan beberapa kaedah untuk membantu pengguna melangkau log masuk ke akaun Microsoft dalam Windows 11 dan mencapai pengalaman yang lebih peribadi dan autonomi. Mula-mula, mari kita fahami sebab sesetengah pengguna enggan log masuk ke akaun Microsoft mereka. Di satu pihak, sesetengah pengguna bimbang bahawa mereka
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:
