Shortcodes and Javascript/jQuery Function Calls [closed]

Question

I'm learning about shortcodes and javascript.

I've simplified my problem as much as possible. In my shortcode's php file I wp_enqueue script1_javascript.js and script2_jquery.js. The first script is javascript and the second is a jQuery script.

In script1_javascript.js, I have:

function hello() {
    alert('Hello');
}

In script2_jquery.js, I call the function:

hello();

Why don't I get "Hello" when I view my page? The shortcode is activated. I've got the shortcode on a page. I wp_enqueued script2 after script1. Will WordPress allow me to call a function from another script? Any suggestion on what's going on or how to fix it?

Thank you.

Answer 1

If your call to wp_enqueue_script is within your shortcode callback function, it's not going to work (but it will in 3.3). Instead, hook into wp_enqueue_scripts, which fires very late in the WP start up process (as the page is rendering), where you can check to see if (1) it's a single post and (2) if that post contains your short code. If it is, then you can enqueue the script.

<?php
add_action( 'wp_enqueue_scripts', 'wpse29672_enqueue_scripts' );
function wpse29672_enqueue_scripts()
{
    // Not a single post? get out of here
    if( ! is_single() ) return;

    // get our post
    global $post;
    if( empty( $post ) ) $post = get_queried_object();

    // See if the post content contains our shortcode
    if( isset( $post->post_content ) && false !== strpos( $post->post_content, '[your-shortcode' ) )
    {
        wp_enqueue_script( 'wpse29672-script', 'http://www.example.com/path/to/script.js', array( 'jquery' ) );
    }
}

Alternatively, you could just hook into wp_enqueue_scripts and enqueue your script. But that would mean it gets loaded on every page. Very sloppy. Try to only load scripts when they're needed.

Answer 2

maybe you can try wp_print_scripts instead of wp_enqueue_scripts.