Your question is a little unclear. I’m interpreting it to mean that you want to enqueue a jQuery script to be run by the user’s browser only on public pages that contain the shortcode.
There are (at least) three ways of running a jQuery script only on pages that have a specific shortcode. The first way is to use the add_shortcode()
function to add a hook to get_footer
which then enqueues the jQuery script in the footer.
//* Enqueue script in the footer
function wpse_260465_enqueue_script() {
wp_enqueue_script( 'your-style-id', PATH_TO . 'script.js', [ 'jquery' ], false, true );
}
//* Add action to enqueue script in the footer and return shortcode value
function wpse_260465_shortcode( $atts ) {
add_action( 'get_footer', 'wpse_260465_enqueue_script' );
return 'your shortcode content';
}
add_shortcode( 'wpse_260465', 'wpse_260465_shortcode' );
The second way registers the script on every page, but only enqueues it when the specific shortcode is called on a page.
//* Enqueue previously registered script and return shortcode value
function wpse_260465_shortcode( $atts ) {
wp_enqueue_script( 'your-style-id' );
return 'your shortcode content';
}
add_shortcode( 'wpse_260465', 'wpse_260465_shortcode' );
//* Register our script to maybe enqueue later
add_action( 'wp_enqueue_scripts', 'wpse_260465_enqueue_scripts' );
function wpse_260465_enqueue_scripts() {
wp_register_script( 'your-style-id', PATH_TO . 'script.js', [ 'jquery' ], false, true );
}
The third way is to simply use the add_shortcode()
function to write the jQuery inline.
//* Return inline jQuery script with shortcode value
function wpse_260465_shortcode( $atts ) {
$your_shortcode_content="your shortcode content";
$your_shortcode_content .= $your_inline_jquery;
return $your_shortcode_content;
}
add_shortcode( 'wpse_260465', 'wpse_260465_shortcode' );
The first and second methods are more the “WordPress way”, and the third is the easiest to understand, but all three should work.