WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] wp_print_scripts places jquery function above jquery src (3 posts)

  1. Glenn Ansley
    Member
    Posted 6 years ago #

    Hi,
    I'm trying to add some jQuery script (a simple alert at this point) to my header, but when I use wp_print_scripts it places it above the code that links the jQuery file.

    If I use admin_head instead of wp_print_scripts, everything works find because my code is placed lower then the JS link in the <head> section of the page.

    Any ideas? Here is my code for inserting:

    ....inside my plugin class
    
    	function adminHead() {
    		wp_enqueue_script('jquery');
    		?>
    		<script type="text/javascript">
    			jQuery(document).ready(function(){
    				alert('test');
    			});
    		</script>
    		<?php
    	}
    
           ..... outside of my plugin class
    		add_action( 'wp_print_scripts', array( &$pluginclassname, 'adminHead')	);

    And here is the generated code in my <head>

    <script type='text/javascript' src='http://localhost/cc/wp-includes/js/jquery/jquery.js?ver=1.2.3'></script>
    
    <script type='text/javascript' src='http://localhost/cc/wp-admin/js/common.js?ver=20080318'></script>
    <script type='text/javascript' src='http://localhost/cc/wp-includes/js/jquery/jquery.color.js?ver=2.0-4561'></script>
    		<script type="text/javascript">
    			jQuery(document).ready(function(){
    				alert('test');
    			});
    		</script>
    		<script type="text/javascript">
    	jQuery(function() {
    		jQuery('#dashboard_incoming_links div.dashboard-widget-content').not( '.dashboard-widget-control' ).find( '.widget-loading' ).parent().load('index-extra.php?jax=incominglinks');
    		jQuery('#dashboard_primary div.dashboard-widget-content').not( '.dashboard-widget-control' ).find( '.widget-loading' ).parent().load('index-extra.php?jax=devnews');
    		jQuery('#dashboard_secondary div.dashboard-widget-content').not( '.dashboard-widget-control' ).find( '.widget-loading' ).parent().load('index-extra.php?jax=planetnews');
    		jQuery('#dashboard_plugins div.dashboard-widget-content').not( '.dashboard-widget-control' ).find( '.widget-loading' ).parent().load('index-extra.php?jax=plugins');
    	});
    </script>

    Any help would be great. Thanks.

  2. Samuel Wood (Otto)
    Tech Ninja
    Posted 6 years ago #

    I'm trying to add some jQuery script (a simple alert at this point) to my header, but when I use wp_print_scripts it places it above the code that links the jQuery file.

    That's correct. Short answer, don't do that. ;)

    Long answer, use the admin_head action for inserting script code directly into the page, and use wp_enqueue_script for inserting script code from a *.js file into the page.

    The admin_head action happens after the print scripts action does, and even WordPress itself uses that to insert javascript code (examine wp-admin/index.php closely).

    For external script files, wp_enqueue_script allows you to specify dependancies, which are used to ensure that the scripts loaded that way load in the correct order. You can safely call the wp_enqueue_script function from a function added to the admin_print_scripts action hook (or anytime earlier, for that matter). It'll work.

  3. Glenn Ansley
    Member
    Posted 6 years ago #

    ahh... that makes sense now.

    So, if I want to run a specific JS function in my <HEAD> that is located in an external library or something, I should 1) use admin_print_scripts to include the link to the library with the function and then 2) use admin_head to perform the call the specific function? I think that's right.

    Thanks again.

Topic Closed

This topic has been closed to new replies.

About this Topic