Load when page loads, not on click, etc(ajax,php)

Question

$(function(){  
    $('p.load_it a').click(function(){  
        $('#demo_content').load('http://d.com/myphp.php?  nice=1149632');  
        return false;  
    });  
});

Click me to load some HTML with AJAX.

    <div id='demo_content'> 

    </div>

I wanted to know if anyone can give me advice as to how I can load this kind of Effect not by a click, but by an animated "loading" effect.

Let me know if anyone has any suggestions.

Are you saying that you want the JavaScript code to be executed when the page loads? — esqew, Mar 17 '11 at 02:54
Yes, after my image and other text has loaded, I want this content to load automatically- and i will be adding a animation loading type spinner(i saw them on ajaxinfo.net, or something like that, its on here somewhere). — Ryan McCullagh, Mar 17 '11 at 03:00

score 2 · Accepted Answer · edited May 23 '17 at 10:29

2

This will execute your load() call when the DOM on the page is ready.

$(document).ready(function() {
    $('#demo_content').load('http://example.com/myphp.php? nice=1149632');
    return false;
});

~~As for your 'loading' request, I suggest you take a look at this StackOverflow question.~~ Nevermind, I just saw you already had something in mind.

edited May 23 '17 at 10:29

Community

1
1

answered Mar 17 '11 at 02:55

esqew

34,625
25
85
121

I proceeded to insert that as followed: $(function(){ $('p.load_it a').click(function(){ $(document).ready(function() { $('#demo_content').load('http://vbizmarketing.com/myphp.php? nice=1149632'); return false; }); }) But It did not work – Ryan McCullagh Mar 17 '11 at 03:19
Once you nest it inside a `$.click()`, it'll only fire once that selector is clicked. Copy it as I wrote it. – esqew Mar 17 '11 at 03:32
Sounds Good-I will replace my current script with your suggested script, and will see what happens-And that stil did not work as planned-- – Ryan McCullagh Mar 17 '11 at 03:45
What does your code look like now and what do you want this code to do *exactly*? – esqew Mar 17 '11 at 03:53
/div>

Load

I am doing a mock up of what my full page will look like, right now I just need to get the data displayed/pulled correctly
– Ryan McCullagh Mar 17 '11 at 03:58
@esqew I want to Load the data that I am requesting via ajax, and basically have a loading bar/progress bar that will display as ajax is automatically pulling the data from the xml into the div. – Ryan McCullagh Mar 17 '11 at 04:01
Make sure your request parameters are free of typos (address doesn't have `http://` and has an extraneous space in there). You're also missing a semicolon after your closing bracket and parenthesis. Check your browser's JavaScript console for more information on errors and warnings in your code. – esqew Mar 17 '11 at 04:17

score 2 · Answer 2 · edited Sep 13 '12 at 16:22

2

$(document).ready(function() {
    $.ajax({
      url: 'http://example.com/myphp.php?nice=1149632',
      success: function(data) {
        $('#demo_content').html(data);
      }
    beforeSend: function(){
        //show loading here
        $('#demo_content').html("Loading...");
    }
    });
});

edited Sep 13 '12 at 16:22

Brad Larson

168,330
45
388
563

answered Mar 17 '11 at 03:08

saturngod

23,567
16
58
86

score 1 · Answer 3 · edited Sep 13 '12 at 16:22

1

If you want the javascript code to be executed when the page has been loaded, you can also add the script at the bottom of the page, like this:

<script>
$('#demo_content').load('http://example.com/myphp.php? nice=1149632');
</script>

edited Sep 13 '12 at 16:22

Brad Larson

168,330
45
388
563

answered Mar 17 '11 at 03:01

EmCo

4,109
2
16
19

Load when page loads, not on click, etc(ajax,php)

3 Answers3