Annuler preventDefault () ou une meilleure façon de désactiver par programme les collections de liens

J'ai une page qui a des auditeurs d'événements pour l'état du réseau. Lorsque le réseau est «hors ligne», je souhaite désactiver toutes les liens de domaine interdisant l'accès à un mode hors connexion. J'essayais d'utiliser .preventDefault() , mais quand l'application revient en ligne, je dois réactiver les liens.

Auditeurs d'événements

 //check network status if(!navigator.onLine) { offlineLinks(); //Offline mode function } //add event listeners for network status window.addEventListener('offline', function(e) { offlineLinks(); //Offline mode function }, false); window.addEventListener('online', function(e) { //need to re-enable links/Online mode }, false); window.addEventListener('error', function(e) { alert('Error fetching manifest: there is a good chance we are offline.'); offlineLinks(); //Offline mode function }); 

Fonction pour "déconnecter"

 function offlineLinks() { $('a[href^="http"]').click(function(e) { e.preventDefault(); $('#offline-dialog').dialog({ modal: true, buttons: { Ok: function() { $(this).dialog('close'); } } }); }); } 

Je recherche une solution évolutive qui ne causera pas de retard s'il y a un nombre important de liens sur la page. Existe-t-il une solution simple pour inverser l'appel .preventDefault() ou une meilleure façon d'accomplir cette tâche?

Solutions possibles


Mes pensées initiales portaient un ensemble de valeurs href et ensuite supprimer / ajouter. J'ai joué avec le stockage HTML5 à l'aide de webdb . Je pourrais créer une base de données pour et dynamiquement tirer sur le cliquet de hrefs … mais je ne sais pas si c'est la meilleure solution pour cela.

Vous semblez utiliser jQuery, au moins pour la partie du gestionnaire de liens.

La chose à réaliser est que $ .click (handler) est juste un raccourci pour .bind ('click', handler). Si vous définissez le gestionnaire ailleurs, vous pouvez également le déconnecter plus tard, comme ceci:

 var handler = function(event) { event.preventDefault(); console.log("the links, they do nothing!"); } // when you want the external links to be inactive. // you could use .click(handler) here too, it's the same. $('a[href^="http"]').bind('click', handler); // when you want them back $('a[href^="http"]').unbind('click', handler); 

En passant, href ^ = "http" est un peu fragile, si vous voulez seulement que cela se produise avec des liens externes. Les liens internes peuvent commencer avec "http", et certains liens externes pourraient commencer avec d'autres protocoles comme "ftp". Mieux vaut donner à ces liens leur propre classe, comme Wikipedia avec «externe».