JQuery only works in second click on loaded Ajax page

I am very new to Ajax and jQuery, so please bear with me. I am uploading content via Ajax on my page, and the uploaded content has jQuery slide shows inside. When I click the link, everything works fine, the content appears, and the whole slide show does not start at all. I need to click this link a second time to start the slide show.

This is my code:

var loadUrl = "map_fr.html"; $("#loader").on('click',function(){ $("#conteudo_projects").html(ajax_load).load(loadUrl); }); 

Then I select the link with id = "loader" to load the contents inside the #conteudo_projects DIV.

Can anyone help me? Why doesnโ€™t the slide show start working the first time? (If I test the slide show directly on the page, it works, so I know that there is no problem with this, it only happens when loading via Ajax).

Many thanks!

EDIT: I installed Firebug, and although I still donโ€™t quite understand that everything that it displays, I noticed that in Net> JS, when I click the link for the first time, I get a jQuery GET request (ajax.googleapis.com) grayish. When I click again, the new request looks fine. I donโ€™t know if this helps, Iโ€™m still trying to do this job. Thanks!

+6
source share
2 answers

Using on api is wrong. Also make sure you bind this event handler to document.ready . Here is what should be in the code:

Also your ajax attack should probably be inside your event handler callback

 $(document).ready(function(){ $(document).on('click',"#loader",function(){ $.ajax(url:url, type:"POST", success:function(data){ $("#conteudo_projects").html(data); }); }); }); 
+2
source

You can use jQuery load to load content like this

This will show the ajax boot image that you saved in the ajax_load variable, and get the content from your url.Once it got the content from the ajax call, it will replace the downloaded snapshot with new content.

 $(function(){ $(document).on('click',"#loader",function(){ $("#conteudo_projects").html(ajax_load).fadeIn(300,function(){ $(this).load(yourUrl); }); }); }); 

jQuery on is available starting from version 1.7+. If you are using a version before this, you might consider jQuery live .

+1
source

Source: https://habr.com/ru/post/913671/


All Articles