data.php
<?php
for($i=0;$i<=10000000;$i++){
}
$name = strtoupper($_REQUEST['urname']);
$birth = strtoupper($_REQUEST['urbirth']);
if(isset($name)){
$html = "<p>Your name: <b>".$name."</b></p>";
$html .= "<p>Your birthplace: <b>".$birth."</b></p>";
print($html);
}
?>index.html
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$('#preloader').hide();
$('#preloader')
.ajaxStart(function(){
$(this).show();
}).ajaxStop(function(){
$(this).hide();
});
$('#form form').submit(function(){
$('#content').empty();
$.get('data.php', $(this).serialize(), function(data){
$('#content').html(data);
});
return false;
});
});
</script>
</head>
<body>
<div id="form">
<form>
Name : <input type="text" name="urname"><br />
Birthplace : <input type="text" name="urbirth"><br />
<input type="submit" name="submit" value="Submit">
</form>
</div>
<div id="preloader">loading...</div>
<div id="content">
</div>
</body>
</html>问题:
当我点击submit按钮时,loading...从来没有出现,为什么?
发布于 2013-07-06 17:09:54
从jQuery 1.8开始,ajaxStart/ajaxStop/...只能绑定到document (link)。请将您的代码更新为:
$(document)
.ajaxStart(function(){
$('#preloader').show();
}).ajaxStop(function(){
$('#preloader').hide();
}); 发布于 2013-07-06 17:10:47
$(document)
.ajaxStart(function(){
$('#preloader').show();
}).ajaxStop(function(){
$('#preloader').hide();
}); 如果只想显示提交表单的预加载器,请使用:
$('#form form').submit(function(){
$('#content').empty();
$('#preloader').show();
$.get('data.php', $(this).serialize(), function(data){
$('#content').html(data);
}).always(function(){
$('#preloader').hide();
});
return false;
});https://stackoverflow.com/questions/17501443
复制相似问题