CODEWITHSUNDEEP
jqueryajaxfunctionloadclick
user1933797
user1933797

Reputation: 1

My Jquery Code Works only one time?

This is My HTML code :

<a href="#" class="menu_item"><img src="Home-48.png" alt="education" /></a>
<br /><br />
<a href="#" class="menu_item"><img src="Shield_48.png" alt="education" /></a>
<br /><br />
<a href="#" class="menu_item"><img src="Education-48.png" alt="education" /></a>
<br /><br />
<a href="#" class="menu_item"><img src="Money-Bag-48.png" alt="education" /></a>

and this is My Jquery Code:

$(document).ready(function(){
    $('.menu_item1').click(function (){
        $('#custom_menu_loading_section').fadeIn(800, function (){
            $('#custom_menu').load('education.html', {}, function () { $( "#accordion" ).accordion({ heightStyle: "fill" }); });
        });
    });
});

i want that when i click on the images, education.html load into the $("#custom_menu"), but it works only one time, for example when i click on the First image it work correctly but after that when i clicked on the second images it does not work !? Why?

my goal: i want to have a menu items ( for exapmle Home, About, contact , ... ) that when a user clicked on it, with jquery load the content of external file ( home.html, about.html ,... ) into the "#custom_menu" with showing the "#custom_menu_loading_section" for loading effect.

Upvotes: 0

Views: 869

Answers (2)

Shibbir Ahmed
Shibbir Ahmed

Reputation: 1350

note from the jQuery team:

jQuery.fn.live() is deprecated; jQuery.fn.die() is deprecated

Cause: The .live() and .die() methods were deprecated in 1.7 due to their performance and usability drawbacks, and are no longer supported.

Solution: Rewrite calls to .live() using .on() or .delegate(). Instructions for doing so are provided in the .live() API documentation.

so use this instead:

$(document).ready(function () {
     $(document).on('click', '.menu_item1', function () {
          // do something
     });
});

Upvotes: 0

WooCaSh
WooCaSh

Reputation: 5212

Try Live instead of click.

From documentation:

Attach an event handler for all elements which match the current selector, now and in the future.

Upvotes: 1

Related Questions