• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 314
  • Last Modified:

How to use JQuery functionality in WordPress?

Hi experts,
We are trying to make use of the JQuery that gets automatically loaded by WordPress but our attempts to use the $ alias fails anywhere outside of the document.ready() function. Below are the main points:

WordPress loads JQuery in its template header file. The jquery.js file that WordPress includes contains jQuery.noConflict(); at the very end of it.

In our document.ready() function, we are able to use $ but ONLY within the document.ready() function itself.

However, we make a call to a regular javascript function that is contained in another javascript file and that other function tries to use $ but it fails to be recognized.

Below is a basic

<script type=text/javascript>
jQuery(document).ready(function($)
{
    $(".thisworksfine").hide();
    
	// call a function that tries to use JQuery $
	TurnOffMouseWheel();
}); 
</script>

Open in new window


The function TurnOffMouseWheel() is contained in another js file we include (called commonfunctions.js). Below is the code for the TurnOffMouseWheel() function contained in commonfunctions.js:

function TurnOffMouseWheel()
{
	$("select").each(function(){
				$(this).bind("mousewheel", function(e){
      				return false;
    			}); // bind
			}); // each
}

Open in new window


We've tried googling a solution and thought we had followed the correct steps but it's still not working.

Are we missing something basic?

thanks experts!
0
rascal
Asked:
rascal
  • 3
  • 3
1 Solution
 
GaryCommented:
In WP use jQuery not $ - its to avoid conflicts with other libraries
0
 
rascalAuthor Commented:
Thanks Gary,
But there are tons of articles that say that in fact we CAN use the $.

For example:
http://matthewruddy.com/using-jquery-with-wordpress/

We would much rather make a small tweak in order to use the $ instead of having to convert all our jquery.

Any chance we can get the $ working?
0
 
GaryCommented:
You can pass $ into the function but you still need to declare its a jQuery function as they describe in the Using No Conflict Mode section.
So you are still going to have to go through all the functions.
0
Introducing Cloud Class® training courses

Tech changes fast. You can learn faster. That’s why we’re bringing professional training courses to Experts Exchange. With a subscription, you can access all the Cloud Class® courses to expand your education, prep for certifications, and get top-notch instructions.

 
rascalAuthor Commented:
Thanks Gary,
We were confused a bit by the documentation regarding passing $ to the function.

Our function declaration in commonfunctions looks like this:

function TurnOffMouseWheel()

and we call it simply by coding: TurnOffMouseWheel().

Would you mind illustrating how we actually pass $ to the function?
0
 
GaryCommented:
This works as you know since you are passing $ into the function after declaring a jQuery function
<script type=text/javascript>
jQuery(document).ready(function($)
{
    $(".thisworksfine").hide();
    
	// call a function that tries to use JQuery $
	TurnOffMouseWheel();
}); 
</script> 

Open in new window


To pass it along to another function you need to pass it in the function call in the code above
TurnOffMouseWheel($);

And then your function becomes.
function TurnOffMouseWheel($)
{
	$("select").each(function(){
				$(this).bind("mousewheel", function(e){
      				return false;
    			}); // bind
			}); // each
} 

Open in new window

0
 
rascalAuthor Commented:
Thanks Gary!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now