Pourquoi je ne peux pas mettre à jour la valeur de mes propriétés d’object JavaScript?

Je ne parviens pas à mettre à jour la valeur de mes propriétés d’object d’application! J’essaie de mettre à jour la propriété ‘visible’ de false à true chaque fois que j’appelle des méthodes dans mon object App!

Maintenant, je ne peux pas comprendre pourquoi je ne peux pas mettre à jour les valeurs !!! Quelqu’un pourrait-il m’aider s’il vous plaît?

Voici le code;

var app = app || {}; app.layout = { // SIDEBAR 'sidebar': function(a) { var options = { 'settings': { 'object': $('.sidebar-left'), 'visible': false, 'type': 'wide' }, 'open': function() { if(options.isActive() === false) { options.settings.visible = true; options.settings.object.addClass('active'); } }, 'close': function() { if(options.isActive() === true) { options.settings.visible = false; options.settings.object.removeClass('active'); } }, 'isActive': function() { if(options.settings.visible === true) { return true; } else { return false; } } } return options[a]; } // HEADER // CONTENT // FOOTER } 

L’idée derrière cette petite API d’application est que je n’ai pas besoin d’aller vérifier manuellement si un conteneur est visible et de modifier l’interface utilisateur manuellement, je pourrais simplement appeler les méthodes app.layout et cela devrait faire l’affaire.

Comme vous pouvez le constater, j’essaie de mettre à jour la valeur de la propriété ‘visible’ lorsque les deux méthodes de app.layout.sidebar('open')(); et app.layout.sidebar('close')(); sont appelés!

Je vous remercie


Voici la version mise à jour:

http://jsfiddle.net/Farzad/ndb1490v/3/

J’espère que cela aidera ceux qui cherchent à l’intégrer à leur application, car il est vraiment facile de garder une trace de votre interface utilisateur sans avoir à vérifier manuellement chaque fois …

Cependant, si quelqu’un connaît une meilleure approche, faites une mise à jour de la version de jsFiddle et créez un lien dans la section commentaires 🙂

Merci les gars, spécialement ceux qui sont utiles

Votre code recrée l’object Options chaque fois que la sidebar est appelée, avec la valeur false comme valeur codée en dur de visible :

 app.layout = { // SIDEBAR 'sidebar': function(a) { var options = { 'settings': { 'object': $('.sidebar-left'), 'visible': false, // <=== Note 'type': 'wide' }, // ... return options[a]; } } 

Donc, tout appel que vous faites comme ceci:

 app.layout.sidebar('open')(); 

... verra toujours options.settings.visible comme false .

Je ne vois aucune raison de la complexité de votre object de layout et ne peux donc pas vraiment recommander un changement approprié, si ce n'est que vous vous assurez que les options ne sont pas recréées à chaque fois.

Si vous préférez utiliser ce type d’appel:

 app.layout.sidebar.open(); 

... alors vous pouvez rendre les choses beaucoup moins compliquées:

 var app = app || {}; app.layout = (function() { var options = { 'settings': { 'object': $('.sidebar-left'), 'visible': false, 'type': 'wide' } }; return { sidebar: { 'open': function() { if(options.isActive() === false) { options.settings.visible = true; options.settings.object.addClass('active'); } }, 'close': function() { if(options.isActive() === true) { options.settings.visible = false; options.settings.object.removeClass('active'); } }, 'isActive': function() { if(options.settings.visible === true) { return true; } else { return false; } } } // HEADER, eg , header: { // ... } // CONTENT // FOOTER }; })(); 

Notez que vous devez vous assurer que ce code est exécuté après la .sidebar-left élément .sidebar-left .


Remarque latérale: les guillemets que vous avez utilisés dans les clés de propriété de l'object options sont tous facultatifs, vous pouvez simplement les laisser:

 var options = { settings: { object: $('.sidebar-left'), visible: false, type: 'wide' } }; 

Il en va de même pour ceux qui définissent la sidebar . Le seul moment où vous avez besoin de guillemets autour des noms de propriété en JavaScript est si le nom n'est pas un identifiant invalide (par exemple, contient des espaces, ou commence par un chiffre mais n'est pas un nombre).