Function not running during the load event of the document-CodePudding

I am writing a chrome extension, that has this content_script. I have written 3 functions to be triggered by 2 respective events - The double Click and Load function.

The Double Click event executes the function written for it, but, the load function or onl oad function are not executing their respective functions.



$("*").dblclick(function(){

    alert("Double Click");     
 
 })
 



document.addEventListener ("onload", myMain, false);

function myMain (evt) {
    alert("On Load");
}


document.addEventListener ("load", myMain, false);

function myMain (evt) {
    alert("Load");
}

CodePudding user response：

You can use the DOMContentLoaded event in JS to achieve this. Like this:

window.addEventListener('DOMContentLoaded', myMain);

function myMain (evt) {
    alert("Load");
}

Hope that's how you wanted it to work.

You can check here for more info - DOMContentLoaded Event

CodePudding user response：

Using jQuery, here is my understanding of desired events :

$(window).on('load', function() {
    alert('Loaded');
});

$(document).ready(function() {
    alert('Ready');
});

$(window).on('dblclick', function() {
    alert('Double click');
});

The difference between event 'load' and 'ready' is :

'Load' is triggered when your page is completely loaded (images, charts ...).
'Ready' is triggered when your page script's is safe to manipulate.

Just check jQuery documentation for event on document loading : https://api.jquery.com/category/events/document-loading/

There is no event to trigger a document 'onload'.