Develop Reference

Why is my onload not working in Wordpress?

I really need to use a onload and I don't understand why it's not working. I made a code snippet to test it out and yet again found that it didn't work. Is wordpress doing this? Or am I making a mistake? I found that events such as onclick and onchange are working.
function do_onload_event()
{
return '<div id="loadevent" onload="do_show_event(event)"></div>' . '<script>
function do_show_event(event)
{
console.log("on load event");
}
</script>';
}
add_shortcode('on_load_event','do_onload_event');

IMHO - Calling onload from in-post shortcode could have many issues of timing or executions. Also, I am not sure that it is possible ot hook to onLoad() or onready() more than once so it would be more compatible..
Since we are dealing with wordpress, you could try another approach using jQuery:
function add_my_scripts() {
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'my_init_script', 'MyScriptSource/etc', 'jquery', '1.0' ); // jQuery dependency
}
add_action( 'init', 'add_my_scripts' );
Then add another script that calls your method.
jQuery.noConflict();
jQuery(document).ready(function($) {
init();
});
You could of course try also for load event
jQuery(window).load(function($) {
// your function
});
or ..
(function($) {
// your function
})(jQuery);

Call JS function in Wordpress, noob question?

I have simple JavaScript function
function hide()
{
document.getElementById('div_sc_1').style.display = "none";
}
in my themefolder/js file I put
function add_scripts(){
wp_enqueue_script( 'quest',
get_stylesheet_directory_uri().'/js/quest.js',
array('jquery'),
'1.0.0',
false
);
}
add_action( 'wp_enqueue_scripts', 'add_scripts' );
in my function.php.
I can call my function from an <input type="submit" onClick="hide();">
BUT I want make something like that in my function.php
<?php
if(isset($_GET[xxx]))
{
<script>
hide()
</script>
}
?>
I don't understand why it doesn't work.

Since you are adding it directly in the dom, so It may run before the target element even exists, Javascript requires an element to available first in order to do its job.
You have to add it once the document is fully loaded so that it can work.
Maybe try this jQuery(document).ready(function($) { hide(); });
If you add it after the document is ready then Javascript will be able to find your element and execute related functions.

If i have javascript file with this implementation when will it fire?

i am trying to understand the following jquery code:
(function( window, undefined ) {
//All the JQuery code here
...
})(window);
If there is a .js file that is included in a page with the <script> </script> tag when will it fire and start runing the function?

It will run the function as soon as the contents of the <script> block are parsed.
Note that your code is different in an important way from:
$(function(jQuery) {
// code
});
The above arranges for the code to run when the document is ready (the DOM is fully parsed and built).

Design a header script to run after the document is finished loading

I have a javascript function, "loadFramework()" that modifies an HTML document. Specifically, it repeatedly runs the jQuery command $("#element-id").load("document/name.html"), which injects the HTML in document/name.html directly into the element with #element-id.
Originally, I ran loadFramework() in a script in the document's header. However, since then I've realized that the function fails if the page has not loaded yet, since it relies on there being an element with #element-id.
I can't figure out how to get this function to run when it should. A simple solution seemed to be setting it to be the document.onload function:
document.onload = function() {
loadFramework();
}
But in this case it never seems to run at all.
How do I make sure a header function runs only after the document has loaded?

You should use window.onload if you are looking for a vanilla JS option
window.onload = function() {
loadFramework();
}

Jquery load takes additional argument "complete". You can run the javascript there. So the code would be:
$("#element-id").load("document/name.html", function(){
loadFramework();
});
You can also use $(document).ready(function{loadFramework()}) inside the html you are loading.

If you want to execute the loadFramework() method after "document/name.html" is loaded, I would suggest the following code.
$(function() {
$("#element-id").load("document/name.html", function(){
loadFramework();
});
});

Getting jQuery to work in new build WordPress theme

I am new to jQuery and have tried to get scripts to work to no avail. I would like to simplify my script to just see that my theme is in fact recognizing my scriptfile.js
My js file is just:
var success = 'SUCCESS!';
jQuery('nav .home a').hover(function()
{
echo(success);
});
my functions.php file has this:
<?php
function add_my_script() {
wp_enqueue_script(
'preview',
get_template_directory_uri() . '/js/scriptfile.js',
array('jquery')
);
}
add_action( 'wp_enqueue_scripts', 'add_my_script' );
?>
My header.php contains:
<script type="text/javascript"><!--//--><![CDATA[//><!--
jQuery(document).ready(function(jQuery){
});
//--><!]]></script>
I am not getting any errors in firebug, but no output either.

Not sure if this is the problem but first of all your selector is not exactly right.
var success = 'SUCCESS!';
jQuery('nav .home a').hover(function(){ ... });
nav should be .nav for class or #nav for id
echo(success);
Unless echo() is a function somewhere it will not work. If you want to show an alert message use alert(success)

I believe what's happening is that your script file is being included fine but the way it's written the hover event attachment will happen before the DOM is ready. Try this, simply say alert(success); in your js file and see if the alert pops up. If it does, then wrap the hover event handler in a function in your script file and call that function from the document.ready function handler in your header.php. By the way, what's the echo function? Probably you are looking for alert.