jQuery | Ajax
load() 方法从服务器加载数据,并把返回的数据放入被选元素中
index.txt
<h1>我是帥哥,你已成功使用Ajax</h1>
index.html
<script>
$(document).ready(function () {
$('button').click(()=>{
$('p').load('index.txt');
});
});
</script>
</head>
<body>
<p></p>
<button>使用Ajax</button>
</body>
回调函数参数:
- responseTxt - 包含调用成功时的结果内容
- statusTXT - 包含调用的状态
- xhr - 包含 XMLHttpRequest 对象
$(document).ready(function () {
$('button').click(()=>{
$('p').load('index.txt',(responseTxt,statusTxt,xhr)=>{
console.log('结果内容:',responseTxt);
console.log('状态:',statusTxt);
console.log('包含 XMLHttpRequest 对象:',xhr);
});
});
});
例子二:
index.php
<?php
$arrayName = array(
//urlencode()函数原理就是首先把中文字符转换为十六进制,然后在每个字符前面加一个标识符%。
//urldecode()函数是用于解码已编码的URL字符串,其原理就是把十六进制字符串转换为中文字符
'name' => urlencode('小陈') ,
'age' => 20 ,
'gender' => urlencode('男'));
print_r(urldecode(json_encode($arrayName)));
$(document).ready(function () {
$('button').click(() => {
$('p').load('index.php', (responseTxt, statusTxt, xhr) => {
let Sjson = JSON.parse(responseTxt);
console.log(Sjson);
console.log('结果内容:', Sjson.name);
console.log('状态:', statusTxt);
console.log('包含 XMLHttpRequest 对象:', xhr);
});
});
});
GET & POST
get:
index.html
$(document).ready(function () {
$('button').click(() => {
$.get("index.php?action=1", (responseTxt, statusTxt, xhr) => {
let Sjson = JSON.parse(responseTxt);
console.log(Sjson);
console.log('状态:', statusTxt);
console.log('包含 XMLHttpRequest 对象:', xhr);
});
});
});
pdo.inc.php
<?php
$_dbms='mysql'; //数据库类型
$_host='localhost'; //数据库主机名
$_dbName='test'; //使用的数据库
$_user='root'; //数据库连接用户名
$_pass='123456'; //对应的密码
$_dsn="$_dbms:host=$_host;dbname=$_dbName";
index.php
<?php
header('Content-Type:text/html;charset=utf-8');
require('pdo.inc.php');
//连接
try {
$dbh = new PDO($_dsn, $_user, $_pass , array(PDO::ATTR_PERSISTENT => true)); //初始化一个PDO对象
} catch (PDOException $e) {
die ("Error!: " . $e->getMessage() . "<br/>");
}
if($_GET['action'] == '1'){
// 操作
try {
$sql = 'SELECT * FROM salarychange';
$stmt = $dbh->prepare($sql);
$stmt->execute();
$result = $stmt->fetchAll();
print_r(json_encode($result));
return json_encode($result);
} catch (PDOException $e) {
print $e->getMessage();
}
}
POST:
index.html
$(document).ready(function () {
$('button').click(() => {
$.post("index.php", {
email: '[email protected]'
},
(data, status) => {
let Sjson = JSON.parse(data);
console.log(Sjson);
console.log('POST状态:', status);
});
});
});
index.php
<?php
header('Content-Type:text/html;charset=utf-8');
require('pdo.inc.php');
//连接
try {
$dbh = new PDO($_dsn, $_user, $_pass , array(PDO::ATTR_PERSISTENT => true)); //初始化一个PDO对象
} catch (PDOException $e) {
die ("Error!: " . $e->getMessage() . "<br/>");
}
//if($_GET['action'] == '1'){
// // 操作
// try {
// $sql = 'SELECT * FROM salarychange';
// $stmt = $dbh->prepare($sql);
// $stmt->execute();
// $result = $stmt->fetchAll();
// print_r(json_encode($result));
// return json_encode($result);
// } catch (PDOException $e) {
// print $e->getMessage();
// }
// }
if($_POST['email']){
// 操作
try {
$sql = 'SELECT * FROM user WHERE email = ?' ;
$stmt = $dbh->prepare($sql);
$stmt->execute(array($_POST['email']));
$result = $stmt->fetchAll();
print_r(json_encode($result));
return json_encode($result);
} catch (PDOException $e) {
print $e->getMessage();
}
}