<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery examples - 4</title>
<link rel="stylesheet" type="text/css" href="css/style2.css">
</head>
<body>
<input id="name" type="text" name="">
<input id="button" type="button" value="load" name="">
<div id="content"></div>
<script type="text/javascript" src="js/jQuery.js"></script>
<script type="text/javascript" src="js/selectors12.js"></script>
</body>
</html>
$('#button').click(function() {
var name = $('#name').val();
$.ajax({
url:'php/page.php',
data: 'name='+name, //sending the data to page.php
success: function(data) {
$('#content').html(data);
}
}).error(function() {
alert('an error occured');
}).success(function() {
/*alert*/
alert('an error occured');
}).complete(function() {
/*alert*/
});
});
error()
无效,当我更改网址时:page.php
扩展名不正确,以检查error()
并显示该网址。
但是,在控制台中显示错误说:
未捕获的TypeError:$ .ajax(...)。错误不是函数
答案 0 :(得分:5)
最新的jQuery将error()
替换为fail()
,以实现链式承诺调用。所以你应该使用
$.ajax({
....
}).done(function(resp){
//do something when ok
}).fail(function(err) {
//do something when something is wrong
}).always(function() {
//do something whether request is ok or fail
});
答案 1 :(得分:1)
也许你正在使用没有ajax功能的jquery的slim构建。尝试从此link
下载常规版本答案 2 :(得分:0)
你需要在这里做两件事。
首先使用下面的代码确保Jquery文件中有Ajax。
<script>
$(document).ready(function() {
console.log($.ajax);
});
</script>
如果这打印错误,那么你没有Ajax。在这种情况下,将jquery更改为指向CDN,如https://code.jquery.com/jquery-2.2.4.min.js。
其次将Ajax函数更改为以下。在这里,我修改了错误和完整功能,并删除了重复成功函数。
$.ajax({
url:'php/page.php',
data: 'name='+name, //sending the data to page.php
success: function(data) {
$('#content').html(data);
}, error : function(e) {
alert('an error occured');
}, complete : function() {
/*alert*/
}
});
答案 3 :(得分:0)
您正在使用瘦身版的jQuery。它不支持ajax调用。使用以下cdn
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery examples - 4</title>
<link rel="stylesheet" type="text/css" href="css/style2.css">
</head>
<body>
<input id="name" type="text" name=""> <input id="button" type="button" value="load" name="">
<div id="content"></div>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/selectors12.js"></script>
</body>
</html>