简体   繁体   中英

Dynamic load page with scripts

If I use jquery function $.load to get some content from server (ASP.net partial view) and load it into div, and if that content has something like:

<script>
$(document).ready(function () {
     some code block
})
</script>

Will that code block be ecexuted after content is loaded into div, will ready event be triggered?

In Ajax calls that contains script tag, all sent scripts will execute after insert to document object model.

But in your case, script tag contains event assignment so event assignment will execute, but why assigned function execute after insert to document object model while ready event don't raised? the reason of this happening it is:

summary :

Ready only similar to event but is not really one event, it is Pseudo-Event.

Detailed

Follow code is source of jquery library:

jQuery.fn.ready = function( fn ) {

    // Add the callback
    jQuery.ready.promise().done( fn );

    return this;
};

you see that ready is a jQuery plugin that get a function. In the body of function said when ready event is done execute sent function.But when ready is done.see JQuery source again:

jQuery.extend( {

    // Is the DOM ready to be used? Set to true once it occurs.
    isReady: false,

    // A counter to track how many items to wait for before
    // the ready event fires. See #6781
    readyWait: 1,

    // Hold (or release) the ready event
    holdReady: function( hold ) {
        if ( hold ) {
            jQuery.readyWait++;
        } else {
            jQuery.ready( true );
        }
    },

    // Handle when the DOM is ready
    ready: function( wait ) {

        // Abort if there are pending holds or we're already ready
        if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
            return;
        }

        // Remember that the DOM is ready
        jQuery.isReady = true;

        // If a normal DOM Ready event fired, decrement, and wait if need be
        if ( wait !== true && --jQuery.readyWait > 0 ) {
            return;
        }

        // If there are functions bound, to execute
        readyList.resolveWith( document, [ jQuery ] );
    }
} );

The following line set that load document object model is done :

// Remember that the DOM is ready
jQuery.isReady = true;

so if Jquery.isReady == true, function that passed to ready method immediately execute.

so ready method is provided for scripts which run in ready state not ready event.

A page can't be manipulated safely until the document is "ready." jQuery detects this state of readiness for you. Code included inside $( document ).ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute. Code included inside $( window ).load(function() { ... }) will run once the entire page (images or iframes), not just the DOM, is ready.

So, yes only after your dom is fully loaded, your code will be executed.

Source

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM