Solved

Jquery click doesn't work

Posted on 2014-09-19
5
131 Views
Last Modified: 2014-09-19
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
Comment
Question by:Richard Korts
  • 2
  • 2
5 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 40333477
The HTML is dynamic so you have to add a listener
e.g.
$(document).on("click","#irr",function() {
0
 

Author Comment

by:Richard Korts
ID: 40333572
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
 
LVL 58

Expert Comment

by:Gary
ID: 40333590
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
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 40333683
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
 

Author Closing Comment

by:Richard Korts
ID: 40333725
Excellent, you are a Jquery expert for SURE!
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Jquery Autocomplete PHP script 3 37
New to Angular - are these sections correct? how to do the $scope 19 47
gif animation 6 35
Angular.js example vocabulary extensions 5 34
by Julian Matz As of jQuery (http://jquery.com/) 1.4 the .live() method (http://api.jquery.com/live/) supports custom events as well as some standard JavaScript events that it previously didn't support. Among these is the submit event. Unlike …
I have answered several questions lately that were solved utilizing the power of jQuery's AJAX functions, so I thought I would write an article demonstrating the ease of use. Why should I use jQuery as opposed to regular JavaScript? Now I know…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

867 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now