Web Analytics Made Easy - StatCounter jQuery not working. - CodingForum

Announcement

Collapse
No announcement yet.

jQuery not working.

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    jQuery not working.

    Have two nav lists (in UL's) and i dont wnt the links to go anywhere. I can do that for the first list but the second doesnt.

    Heres my HTML (render from the broswer)

    Code:
    <body>

<div id="miniProCover" style="width: 100%; height: 100%; background-color: rgb(0, 0, 0); display: none; position: fixed; top: 0px; left: 0px; z-index: 1000; opacity: 0.5;" onclick="$('#miniPro, #miniProCover').fadeOut();$('#video').show();"></div>
<div id="miniPro" class="block" style="display: none; color: rgb(255, 255, 255); width: 1000px; height: 500px; overflow-y: auto; background-color: rgb(51, 51, 51); position: fixed; top: 50%; margin-top: -250px; left: 50%; margin-left: -500px; z-index: 9999; border-radius: 2em 2em 2em 2em;"><span onclick="$('#miniPro, #miniProCover').fadeOut();$('#video').show();" style="float: right; margin-right: 15px; margin-top: 1px; cursor: pointer;">Close</span>

<h3 class="block-title" style="margin-top: 1px;"><span style="color: rgb(42, 42, 42);">Notifications</span></h3>
<div id="notS">
ID = 58You have no new notifications</div>

</div>


	<div id="container">
			<ul id="navigation">
    
		<li><a href="http://www.angelgamers.com/" rel="home"><span>Home content</span></a></li>
        
        <li><a href="forum/" rel="members"><span>Members</span></a></li>
		       
        <li><a href="http://www.angelgamers.com/media" rel="games"><span>Games</span></a></li>
		
        <li><a href="http://www.angelgamers.com/About.php" rel="staff"><span>Staff</span></a></li>

		<!--<li><a href="http://www.angelgamers.com/ChipShop" rel="admin"><span>Admin log</span></a></li>-->
        
        <li><a href="http://www.angelgamers.com/support.php" rel="support"><span>Support</span></a></li>
        
 <!--       <li><a href="http://www.angelgamers.com/Staff.php" rel=""><span>Staff</span></a></li>-->




        

	</ul>		<center>
        <h1 id="banner"><a href="#">Angel Gammers</a></h1>

		<!-- sponsors -->

	
      
      <div id="subMenu">	<ul class="navigation2">
		<li><a class="noGo" href="h"><span>View tickets</span></a></li>
        <li><a href="forum/"><span>Edit a ticket</span></a></li>
        <li><a href="http://www.angelgamers.com/media"><span>Delete a ticket</span></a></li>
        <li><a href="http://www.angelgamers.com/media"><span>Ban a member</span></a></li>

	</ul>

</div>
    Then the JS

    Code:
    $(document).ready(function()
{
	$("#navigation li a").click(function(even){
		even.preventDefault();	
	});
	$("#navigation2 li a").click(function(e){
		e.preventDefault();	
	});
		
	$("#navigation li a").mouseover(function(){

		linkk = $(this).attr("rel");
		$.ajax({
	    	type: "POST",
		   	url: "template/subMenu.php",
	    	data: "menu="+linkk,
	    	success: function(msg){
				$("#subMenu").html(msg);
			}
    	});
	});
});
    Im sure it will be a dumb mistake, but i cant see it, can anyone else?
    Tags: None
  • #2
    The second one uses a class, and not an id.
    .My new Javascript tutorial site: http://reallifejs.com/
    .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
    .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback

    Comment

    • #3
      Oops, the jQuery code wasnt the latest, i did chnge it to look for a class not a id but that still didnt work either

      Comment

      • #4
        Then, please, show us this code instead ...

        Comment

        • #5
          The only difference was jquery looked for a class

          Code:
          $(document).ready(function()
{
	$("#navigation li a").click(function(even){
		even.preventDefault();	
	});
	$(".navigation2 li a").click(function(e){
		e.preventDefault();	
	});
		
	$("#navigation li a").mouseover(function(){

		linkk = $(this).attr("rel");
		$.ajax({
	    	type: "POST",
		   	url: "template/subMenu.php",
	    	data: "menu="+linkk,
	    	success: function(msg){
				$("#subMenu").html(msg);
			}
    	});
	});
});
          Last edited by tomharto; Sep 8, 2011, 02:28 AM.

          Comment

          • #6
            You don’t have to repeat everything, you can just put the selectors in one Dollar function, separated by comma, like you would do in CSS:

            Code:
            $("#navigation li a, .navigation2 li a").click(function(e){
  e.preventDefault();	
});
            Other than that it looks alright to me so I don’t see why it wouldn’t be working. Are any JS errors coming up in the error console?
            Stop solving problems you don’t yet have!

            Comment

            • #7
              I tried that and it does nothing, the link still goes to the href, i get no errors in Firebug

              Comment

              • #8
                Can you give us a link to a live example?
                Stop solving problems you don’t yet have!

                Comment

                • #9
                  http://www.angelgamers.com/_aGadminCp/, The top level menu works, but the second one doesnt.

                  Comment

                  • #10
                    At the time you are settting the click handler, those links in navagation2 aren't even there yet, so naturally they won't know about it.

                    You could either use .live() instead of .click(), or do it manually by setting the click handler in the AJAX callback.
                    .My new Javascript tutorial site: http://reallifejs.com/
                    .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
                    .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback

                    Comment

                    • #11
                      Originally posted by venegal View Post
                      ...or do it manually by setting the click handler in the AJAX callback.
                      How do you mean? Put the javascript for the nav2 click on the subMenu.php page?

                      Comment

                      • #12
                        Originally posted by tomharto View Post
                        How do you mean? Put the javascript for the nav2 click on the subMenu.php page?
                        I don't think that's what I mean.


                        1.) Use .live() instead of .click():
                        PHP Code:
                        $(".navigation2 li a").live('click', function(e){
                                                    e.preventDefault();    
                        }); 

                        or 2.) Add the click handler after the links have actually been created — in the AJAX callback:

                        PHP Code:
                        success: function(msg){
                            $(                        "#subMenu").html(msg);
                            $(                        ".navigation2 li a").click(function(e){
                                                        e.preventDefault();    
                            });
                        } 
                        .My new Javascript tutorial site: http://reallifejs.com/
                        .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
                        .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback

                        Comment

                        • #13
                          Ahh okay , thanks . Ill take a look at live see what that does and decide from there.

                          Comment

                          Previous template Next
                          Working...
                          X
                          😀
                          🥰
                          🤢
                          😎
                          😡
                          👍
                          👎