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>
问题：
当我单击“提交”按钮时，loading...从不显示，为什么？
从jQuery 1.8开始，ajaxStart/ajaxStop/...只能绑定到document（link）。请更新您的代码：
$(document)
.ajaxStart(function(){
$('#preloader').show();
}).ajaxStop(function(){
$('#preloader').hide();
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句