проблема с ajaxStart в Jquery

data.phpпроблема с ajaxStart в Jquery

<?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... никогда не показывается, почему?

источник

2013-07-06 user2507818

Начиная с jQuery 1.8 ajaxStart/ajaxStop/... может быть привязан только к document (link). Пожалуйста, обновите ваш код следующим образом:

$(document) 
    .ajaxStart(function(){ 
     $('#preloader').show(); 
    }).ajaxStop(function(){ 
     $('#preloader').hide(); 
    });

источник

2013-07-06 09:09:54 mishik

$ (это) здесь относится к документу, завернутые в объект Jquery –

Хорошая точка, обновленная – mishik

$(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; 
    });

источник

2013-07-06 09:10:46

проблема с ajaxStart в Jquery

ответ

Смежные вопросы