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

Jquery click doesn't work

Hello,

See this: http://rkassoc.org/Davis/menu/menu_testb.htm. Note that if you click Irrigation (top item) or Landscape (bottom item), it paints a submenu; then if you click the gold "<", it goes back.. Code attached.

See http://rkassoc.org/Davis/index10.htm. The same menu (& I believe same jquery functions) are included in this file. Note the click on Irrigation or Landscape produces nothing.

Code attached.

Why does it work in one case & not the other?

Thanks
index10.htm
menu-testb.htm
0
Richard Korts
Asked:
Richard Korts
  • 2
  • 2
1 Solution
 
GaryCommented:
The HTML is dynamic so you have to add a listener
e.g.
$(document).on("click","#irr",function() {
0
 
Richard KortsAuthor Commented:
To Gary,

I did that, still doesn't work;
__________________________________
<script>
$(function () {
    $(document).on("click","#irr",function()  {
          $('#menu').html('<li><span style="color: #5A63E7;">></span> Sprinkler</li><li><span style="color: #5A63E7;">></span> Drip / Low Volume</li><li><span style="color: #5A63E7;">></span> Pumps</li><li><span style="color: #5A63E7;">></span> Water Management</li>');
              $('#goback').html('<span style="background-color:black; white-space: nowrap; cursor: pointer;"><</span>');
    });
      $(document).on("click","#goback",function()  {
            location.reload();
      });
      $(document).on("click","#lsc",function()  {
          $('#menu').html('<li><span style="color: #5A63E7;">></span> Evaporative Cooling</li><li><span style="color: #5A63E7;">></span> Decks & Structures</li><li><span style="color: #5A63E7;">></span> Geotextile Fabrics</li><li><span style="color: #5A63E7;">></span> Tools</li>');
              $('#goback').html('<span style="background-color:black; white-space: nowrap; cursor: pointer;"><</span>');
    });      
});      
</script>
___________________________________

http://rkassoc.org/Davis/index10.htm
0
 
GaryCommented:
Is there any reason to be using an old version of jQuery?
Didn't realise it was old so you would need to use .live()
http://api.jquery.com/live/

$("#irr").live("click",function()  {
0
 
leakim971PluritechnicianCommented:
remove this block :
<script>
$(function () {
});	
</script>

Open in new window


and replace :
$("#includedContent").load("b.html");
by :
$("#includedContent").load("b.html", function() {

// WE PUT IT HERE ONCE THE MENU IS LOADED

    $('#irr').click(function() {
          $('#menu').html('<li><span style="color: #5A63E7;">></span> Sprinkler</li><li><span style="color: #5A63E7;">></span> Drip / Low Volume</li><li><span style="color: #5A63E7;">></span> Pumps</li><li><span style="color: #5A63E7;">></span> Water Management</li>');
		  $('#goback').html('<span style="background-color:black; white-space: nowrap; cursor: pointer;"><</span>');
    });
	$('#goback').click(function() {
		location.reload();
	});
	$('#lsc').click(function() {
          $('#menu').html('<li><span style="color: #5A63E7;">></span> Evaporative Cooling</li><li><span style="color: #5A63E7;">></span> Decks & Structures</li><li><span style="color: #5A63E7;">></span> Geotextile Fabrics</li><li><span style="color: #5A63E7;">></span> Tools</li>');
		  $('#goback').html('<span style="background-color:black; white-space: nowrap; cursor: pointer;"><</span>');
    });	

// END

          
});

Open in new window

0
 
Richard KortsAuthor Commented:
Excellent, you are a Jquery expert for SURE!
0

Featured Post

Learn to develop an Android App

Want to increase your earning potential in 2018? Pad your resume with app building experience. Learn how with this hands-on course.

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