Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Oct 2009
    Posts
    438
    Thanks
    9
    Thanked 7 Times in 7 Posts

    jQuery won't work with Wordpress

    All,
    I have the following bit of code:
    Code:
    <script type="text/javascript">
    $(document).ready(function() {
    var url='http://search.twitter.com/search.json?callback=?&q=test';
     	$.getJSON(url,function(json){
    		$.each(json.results,function(i,review){
    			if(i==1){
    			$("#reviews").html('<div id=reviewnum'+i+'><b>'+review.text+'</b><br>Reviewed By: '+review.from_user+'</div>');
    			//$("#reviews").append('<div id=reviewnum'+i+'>'+review.text+'</div>');
    			}else{
    			$("#reviews").append('<div id=reviewnum'+i+'><b>'+review.text+'</b><br>Reviewed By: '+review.from_user+'</div>');
    			$("#reviewnum"+i).hide();
    			}
    		});
    	});
    });
    
    function rotatereview(){
    	var number_id = 2;
    	var old_number_id;
    	var refreshId = setInterval(function() {
    		if(number_id==6){
    		old_number_id = number_id - 1;
    		$("#reviewnum"+old_number_id).hide("slow");
    		number_id = 1;
    		$("#reviewnum"+number_id).show("slow");
    		}else{
    		if(number_id==1){		
          	$("#reviewnum"+number_id).show("slow");
    		}else{
    		old_number_id = number_id - 1;
    		$("#reviewnum"+old_number_id).hide("slow");
    		$("#reviewnum"+number_id).show("slow");
    		}
    		}
    		number_id++;
      	 }, 5000);
      	 $.ajaxSetup({ cache: false });
    }
    rotatereview();
    </script>
    This code runs at the header or footer (I've tried at both places) of one of my wordpress template pages. The json never gets called to populate the div. I do have the div on my page so it isn't missing but that part works fine.

    I looked and wordpress looks like it's trying to load the following jquery:
    <script type='text/javascript' src='http://localhost/wordpress/wordpress/wp-includes/js/jquery/jquery.js?ver=1.6.1'></script>

    I'm not sure why my jquery won't work with this? Can anyone give me any ideas?

    Thanks in advance!

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,591
    Thanks
    0
    Thanked 644 Times in 634 Posts
    Perhaps your code is conflicting with other code already in the page.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    Regular Coder
    Join Date
    Oct 2009
    Posts
    438
    Thanks
    9
    Thanked 7 Times in 7 Posts
    I'm not sure why, but if I changed $ to jQuery it works good.

  • #4
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,950
    Thanks
    9
    Thanked 724 Times in 718 Posts
    Here's the explanation:

    http://codex.wordpress.org/Function_...flict_wrappers

    I always manually add jQuery to the Wordpress header.php to avoid this sort of thing - never had any problems using this approach.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •