Hello. The topic is very hackneyed, but I could not find an answer. Everyone knows that after uploading AJAX data, the rest of the scripts will not be executed. It is necessary to initialize them through success, ajaxComplete, etc. But I have never found a solution for native javascript anywhere. All solutions concern jQuery! It so happened that part of the code (photo gallery) was written in native javascript. I think there is no need to upload all the code. Scroll through the photos like this:

var gallery = new Gallery(sources); Array.prototype.forEach.call(links, function(link, index) { link.onclick = function() { gallery.show(index); }; });

How do I make this code work? The success, ajaxComplete methods are only suitable for jQuery. Perhaps, try to bind the code above to jQuery, but I don’t know how to do this.

Duck Learns Mind - you are right. You need to add a call code.

 var WORKS_METHOD ={ handlerData:function(resJSON){ var templateSource = $("#works-template").html(), template = Handlebars.compile(templateSource), worksHTML = template(resJSON); $('#works-container').html(worksHTML); }, loadWorksData : function(){ $.ajax({ url:"https://path/to/worksdata.json", method:'get', success:this.handlerData }) } }; $(document).ready(function(){ WORKS_METHOD.loadWorksData(); });

AJAX call loads thumbnails of photos, on click on which this gallery is called. Do you suggest rewriting the call to xmlHTTPRequest?

  • there is no ajax in this code, $ .ajax in pure javascript is an XMLHTTPRequest object ( learn.javascript.ru/ajax-xmlhttprequest ) - Duck Learns to Hide
  • Yes you are right. I had to give the call code. - anxieter
  • So decide, native js or jquery. $ .ajax is jQuery. So you already have it - Duck Learns to Hide

1 answer 1

Use the jQuery.on event functions — you have links, so do the same as the examples in the documentation:

 $( ".myLinkClass a").on( "click", function() { var index = 0; // Вычисляем index для показа соответствующей галереи // ... // Показываем её gallery.show(index); });

The index can be stored in the link in the data attribute, or calculated dynamically.

  • Yes, as it turned out - no special magic was required. The only thing is $( ".myLinkClass a").on( "click", function() {}); in the wrapper $(document).ready(function(){}); still refuses to work. Only through $( document ).ajaxComplete(function() {]) ; In which I placed a call to the object var gallery = new Gallery(sources); - anxieter