Skip Navigation

[Résolu] jQuery being inhibited by Ajax view page transition

Ce fil est résolu. Voici une description du problème et la solution proposée.

Problem: I am using jQuery's click method to assign some click event handlers to elements in my View content, but after an AJAX pagination event the click handlers no longer work as expected.

Solution: Use jQuery's on method and attach the listener to document with a class-based limiter, instead of attaching 'click' listeners to some element that may or may not exist in the DOM after pagination.

Relevant Documentation:
https://api.jquery.com/on/

This support ticket is created Il y a 4 années et 1 mois. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Aucun de nos assistants n'est disponible aujourd'hui sur le forum Jeu d'outils. Veuillez créer un ticket, et nous nous le traiterons dès notre prochaine connexion. Merci de votre compréhension.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

Ce sujet contient 2 réponses, a 2 voix.

Dernière mise à jour par alexG-4 Il y a 4 années et 1 mois.

Assisté par: Christian Cox.

Auteur
Publications
#1660513

I am using jQuery to display a modal when visitors click on a More button on posts within an archive.

See lien caché

My problem is that the click on More isn't being triggered after an Ajax page transition, as this video shows
lien caché

I really like the ajax transition effect. Is there I way I can retain this and still implement my jQuery functionality?

Thanks

Alex

#1662175

Usually you can fix this by changing the click handler code that triggers the modal. Instead of something like this:

jQuery('.more').click(function(){ ...

You should place the click handler on the document object, and use the more class as a limiter:

jQuery(document).on('click', '.more', function(){ ...

Since the document isn't replaced or modified during the AJAX page transition, the click handler will continue to function. If this isn't working for you, I will need to know more about how the click handler is added in jQuery.

#1662347

Spot-on Christian!

I was hoping there'd be simple work-around.

Thanks.

My issue is resolved now.

Ce ticket est maintenant fermé. Si vous êtes un client de Toolset et que vous avez besoin d'aide, veuillez ouvrir un nouveau ticket d'assistance