I am using jquery(newbie for jquery) i开发者_StackOverflow社区n my application. In short what I am doing: I have a home page, where user enters his name and gets results on the same page. So I wrote two functions in home.php , one for body load event another for getting user's result. I have "get_home_info.php" which will load on body's load event and get_info.php on button click event which will overwrite "get_home_info.php" and give user search results(i.e get_info.php). These functions are as follows:
$(document).ready(function(){
$('body').load($.get('/get_home_info.php', function(data){
$('#get_data').html(data);
}));
});
And another one for getting user result:
$(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: There are div tags in below code properly in body. Now my problem is that, I am not able to execute these two functions simultaneously, i.e when I comment bodyload function, and enter user name I get result, and uncommenting body and trying username simply shows search result.
My question are :
- can I write two function and execute these two functions at a time.
- How can I give effects like on button's click event first page should disappear so that I can show loading image and after that result.
Can somebody help here please? thank you in advance.
you should place those two functions in 1 $(document).ready(function(){});
and you can elemenate $('body').load()
function because the .load()
function is already an ajax call to a static html element.
$(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();
});
}
});
});
you can get more definitions in the .load()
function in here
and $.get()
in here
Try one $(document).ready block, so:
$(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();
});
}
});
});
精彩评论