2017-09-17 3 views
0

J'ai écrit un petit plugin jQuery qui cherche les modifications pour former des entrées sur la page, et alerte l'utilisateur s'il quitte la page sans sauvegarder.Accès et modification d'une variable de plugin jQuery en dehors du plugin

Le plugin ressemble à ceci:

(function ($) { 
    $.extend({ 
     unsaved: function() { 
      var unsaved = false; 

      $("form").find("input").on("change", function() { 
       unsaved = true; 
      }); 

      $("form").on("submit", function() { 
       unsaved = false; 
      }); 

      function unloadPage(){ 
       if (unsaved){ 
        return "You have unsaved changes on this page. Do you want to leave this page and discard your changes or stay on this page?"; 
       } 
      } 
      window.onbeforeunload = unloadPage; 
     } 
    }); 
}(jQuery)); 

Et je l'appelle comme ceci:

// Look out for unsaved data 
$.unsaved(); 

Cependant, je suis maintenant l'ajout/suppression des données en utilisant Ajax, et je voudrais manuellement marquez unsaved comme vrai par la suite afin que l'utilisateur soit averti s'il essaie de quitter la page sans enregistrer.

Je crois que ce que je cherche à faire est quelque chose comme

// Call the plugin as normal 
var unsaved = $.unsaved(); 

// Do some stuff with ajax here 
// ... 

// Manually mark the page as unsaved 
unsaved.markAsUnsaved(); 

J'ai essayé de créer une fonction markAsUnsaved() dans mon plug-in dans toutes sortes de façons différentes, mais ne peut le faire fonctionner.

Répondre

0

vous devez retourner votre fonction markAsUnread:

(function ($) { 
    $.extend({ 
     unsaved: function() { 
      var self = this; 
      self.isUnsaved = false; 

      $("form").find("input").on("change", function() { 
       self.isUnsaved = true; 
      }); 

      $("form").on("submit", function() { 
       self.isUnsaved = false; 
      }); 

      function unloadPage(){ 
       if (self.isUnsaved){ 
        return "You have unsaved changes on this page. Do you want to leave this page and discard your changes or stay on this page?"; 
       } 
      } 
      window.onbeforeunload = unloadPage; 
      return { 
       markAsUnsaved: function() { 
        self.isUnsaved = true; 
       }; 
      }; 
     } 
    }); 
}(jQuery)); 

nous utilisons self comme référence pour unsaved classe plugin, renommer également unsaved variable booléenne à différent du nom plugin. then plugin renvoie un objet qui contient la fonction markAsUnread.