wp_enqueue_script adding conditional statement not working

Question

This is the code im using in my functions file:

add_action('init', 'sort_out_jquery_pngfix_frontend');
function sort_out_jquery_pngfix_frontend() {
    global $wp_scripts;
    if(!is_admin()) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', array(), NULL, true);
        wp_register_script('dd_belatedpng', get_stylesheet_directory_uri() . '/js/dd_belatedpng.js', array(), NULL, true);
        $wp_scripts->add_data('dd_belatedpng', 'conditional', 'lt IE 7');
    }
}

add_action('wp_print_scripts', 'register_theme_scripts');
function register_theme_scripts() {
    if(!is_admin()) {
        wp_enqueue_script('modernizr', get_stylesheet_directory_uri() . '/js/modernizr-1.7.min.js', array(), NULL, false);
        wp_enqueue_script('googlemaps', 'http://maps.google.com/maps/api/js?sensor=false', array(), NULL, true);
        wp_enqueue_script('jquery');
        wp_enqueue_script('dd_belatedpng');
        wp_enqueue_script('sc_wc_js', get_stylesheet_directory_uri() . '/js/function.js', array('jquery', 'dd_belatedpng'), '1.0', true);
    }
}

I'm using $wp_scripts->add_data('dd_belatedpng', 'conditional', 'lt IE 7'); to add a conditional statement to this script as per the documentation I can find on-line but its not working. The conditional code is not shown but the js file is.

Why is this not working?

Answer 1

From quick look at code this conditional only seems to be processed for styles and not scripts.

Answer 2

It is a long shot, but you might try registering the script, then adding in the conditional, and then enqueueing the script:

// Register the script
wp_register_script( 'dd_belatedpng', get_stylesheet_directory_uri() . '/js/dd_belatedpng.js', array(), NULL, true );
// Attempt to add in the IE conditional tags
$wp_scripts->add_data('dd_belatedpng', 'conditional', 'lt IE 7');
// Enqueue the script
wp_enqueue_script( 'dd_belatedpng' );

I don't know that it will work, though

EDIT

Based on the related Trac ticket, it appears $wp_scripts doesn't support this method.

You may just need to pull the script out of the wp_enqueue_script() system, and echo the IE conditional-enclosed script call inside of a pluggable function hooked into wp_print_scripts or wp_head. It's certainly not ideal, but if this is a single-use client Theme, then you don't have to worry about someone else needing to deregister the script.

Answer 3

This is the work around I had to put in place since WP doesnt support what I was trying to do

functions.php

add_action('init', 'sort_out_jquery_pngfix_frontend');
function sort_out_jquery_pngfix_frontend() {
    if(!is_admin()) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', array(), NULL, true);
        wp_register_script('dd_belatedpng', get_stylesheet_directory_uri() . '/js/dd_belatedpng.js', array(), NULL, true);
    }
}

add_action('wp_print_scripts', 'register_theme_scripts');
function register_theme_scripts() {
    if(!is_admin()) {
        wp_enqueue_script('modernizr', get_stylesheet_directory_uri() . '/js/modernizr-1.7.min.js', array(), NULL, false);
        wp_enqueue_script('googlemaps', 'http://maps.google.com/maps/api/js?sensor=false', array(), NULL, true);
        wp_enqueue_script('jquery');
        wp_enqueue_script('sc_wc_js', get_stylesheet_directory_uri() . '/js/function.js', array('jquery'), '1.0', true);
    }
}

footer.php

<?php wp_footer(); ?>
<!--[if lt IE 7]>
<?php wp_print_scripts(array('dd_belatedpng')); ?>
<script>DD_belatedPNG.fix("img, .png_bg");</script>
<![endif]-->

Answer 4

Just found a partial solution for this via $is_IE in wp-includes/vars.php!

function emporium_enqueue_scripts() {
    global $is_IE;
    if( $is_IE ) {
        wp_register_script( 'emporium-focus' , get_template_directory_uri() . '/library/focus.js', '', '',  true );
        wp_enqueue_script( 'emporium-focus' );
    }
}
add_action('init', 'emporium_enqueue_scripts');

That seems to load library/focus.js on an if IE basis but there's nothing in core to do any IE version conditionals for scripts. Looks like a Trac ticket on the subject has been shelved for the time being.

Answer 5

It looks like you are putting it in the footer. Did you look at the end of the page for the JS file?

Answer 6

This works for scripts too. But only in one situation: If the script was registered first. You can't go straight for enqueue. You'll have to do: register -> add_data -> enqueue. This is both for scripts as for styles the same rule.

Answer 7

Here is a working example for Wordpress 4.2 and above.

This first example was previously answered here.

    wp_register_script("ie_jshandle",
                 get_template_directory_uri() . "/js/jsSpecificIE.js",
                 array(),
                 '1.0',
                 false );
    wp_enqueue_script("ie_jshandle");
    wp_script_add_data("ie_jshandle", "conditional", "lt IE 9");    

You can also use $wp_scripts variable like this:

function wpse_20873_enq_scripts() {
global $wp_scripts;
        wp_register_script("ie_jshandle",
                     get_template_directory_uri() . "/js/jsSpecificIE.js",
                     array(),
                     '1.0',
                     false );
        wp_enqueue_script("ie_jshandle");

        $wp_scripts->add_data("ie_jshandle", "conditional", "lt IE 9"); 
}
add_action("wp_enqueue_scripts", "wpse_20873_enq_scripts");

wp_script_add_data reference