Problème lors de l'utilisation de JQuery pour l'événement de chargement de corps

Question

J'utilise jquery (newbie for jquery) dans mon application. Bref ce que je fais: j'ai une page d'accueil, où l'utilisateur saisit son nom et obtient des résultats sur la même page. J'ai donc écrit deux fonctions dans home.php, une pour l'événement body load et une autre pour obtenir le résultat de l'utilisateur. J'ai "get_home_info.php" qui chargera sur l'événement de chargement de corps et get_info.php sur l'événement de clic de bouton qui écrasera "get_home_info.php" et donnera des résultats de recherche d'utilisateur (c'est-à-dire get_info.php). Ces fonctions sont les suivantes:

$(document).ready(function(){   
      $('body').load($.get('/get_home_info.php', function(data){ 
      $('#get_data').html(data); 
     })); 
    }); 

Et un autre pour obtenir résultat utilisateur:

$(document).ready(function(){ 
    $("#btn_submit").bind('click', function(){ 
     if($('#tnm').val() != '' && $('#tnm').val() != 'Enter a twitter username to know its Honest Followers!'){ 

     $('#loadimg').html('<img src="images/images/ajax-loader.gif">'); 
      $('#loadimg').show();  
      $.get('/get_info.php?tnm='+$('#tnm').val(), '', function(data){ 
       $('#get_data').html(data); 
       $('#loadimg').hide(); 
      }); 
     } 
    }); 
}); 

Note: Il y a des balises div dans le code ci-dessous correctement dans le corps. Maintenant, mon problème est que je ne suis pas capable d'exécuter ces deux fonctions simultanément, c'est-à-dire lorsque je commente la fonction bodyload, et que j'obtiens le résultat, et que le corps et le nom d'utilisateur essayent simplement.

Ma question sont:

1. puis-je écrire deux fonctions et d'exécuter ces deux fonctions à la fois.
2. Comment puis-je donner des effets comme la première page de l'événement de clic sur le bouton devrait disparaître afin que je puisse montrer l'image de chargement et après ce résultat.

Quelqu'un peut-il vous aider ici s'il vous plaît? merci d'avance.

Answer 1

vous devez placer ces deux fonctions en 1 $(document).ready(function(){}); et vous pouvez elemenate $('body').load() fonction parce que la fonction .load() est déjà un appel ajax à un élément HTML statique.

$(document).ready(function(){ 

    $.get('/get_home_info.php', function(data){ $('#get_data').html(data); }); 

    $("#btn_submit").bind('click', function(){ 
     if($('#tnm').val() != '' && $('#tnm').val() != 'Enter a twitter username to know its Honest Followers!'){ 

     $('#loadimg').html('<img src="images/images/ajax-loader.gif">'); 
      $('#loadimg').show();  
      $.get('/get_info.php?tnm='+$('#tnm').val(), '', function(data){ 
       $('#get_data').html(data); 
       $('#loadimg').hide(); 
      }); 
     } 
    }); 
}); 

vous pouvez obtenir plus de définitions dans la fonction .load() dans here

et $.get() dans here

Answer 2

Essayez un $ (document) de bloc .ready, donc:

$(document).ready(function(){ 
    $('body').load($.get('/get_home_info.php', function(data){ 
      $('#get_data').html(data); 
    }); 
    $("#btn_submit").bind('click', function(){ 
     if($('#tnm').val() != '' && $('#tnm').val() != 'Enter a twitter username to know its Honest Followers!'){ 

     $('#loadimg').html('<img src="images/images/ajax-loader.gif">'); 
      $('#loadimg').show();  
      $.get('/get_info.php?tnm='+$('#tnm').val(), '', function(data){ 
       $('#get_data').html(data); 
       $('#loadimg').hide(); 
      }); 
     } 
    }); 
});