2010-07-31 8 views
1

J'ai un extrait de code, pour calculer la largeur de certains éléments enfants et au lieu de déclarer la parentWidth et d'autres variables dans TOUTES les fonctions .. J'essaie de créer des variables globales à re -utilisé .. mais, ce ne fonctionne pas.jQuery Les variables globales ne sont pas accessibles par les fonctions

est ici une partie de mon code:

$(document).ready(function(){ 

parentWidth = $(this).parent().width();  // parent width in pixels 
margin = parentWidth/100;    // pixel equivalent of a 1% margin 
border = 6;     // 6px total border for each input field 


    $(".element.twoinone input").each(function() { 
     $(this).css('width', 
      (((parentWidth - (margin * 2)) - (border * 2))/2) 
      + 'px'); 
    }); 
}); 

Le parentWidth, les variables de marge et bordures ne sont pas accessibles par la fonction « chaque » (que j'ai multiple). J'ai essayé d'utiliser live(), livequery(), .. etc. mais pas de dés. Je sais que c'est probablement quelque chose de simple que cette noob est en train de dominer .. donc toute aide est grandement appréciée !! Merci! En outre, si vous avez une entrée sur le calcul des pourcentages de largeur à partir d'un conteneurs parents largeur et de la comptabilité pour chaque frontière éléments, la marge et qté, .. Je suis toutes les oreilles: D

MISE À JOUR est-ce pas : {

parentWidth = $(this).parent().width();  

    $(".element.twoinone input").each(function() { 
     $(this).css('width', 
      (((parentWidth - (margin * 2)) - (border * 2))/2) 
      + 'px'); 
    }); 
}); 

$ (document) .ready (function() La même chose que ceci:

$ (document) .ready (function() {

$(".element.twoinone input").each(function() { 
     $(this).css('width', 
      ((( $(this).parent().width()  - (margin * 2)) - (border * 2))/2) 
      + 'px'); 
    }); 
}); 
+0

Que vous * * 'attendez this' pour être dans le calcul de la largeur de parent? –

+0

Je m'attends à ce que 'this' soit l'élément J'utilise la variable IN .. Donc, lorsque vous utilisez parentWidth dans $ (". Element.twoinone input"), je veux 'this' == $ (". Element. twoinone input ") – revive

+0

N'est-ce pas: parentWidth = $ (this) .parent(). width(); $ (". Element.twoinone input"). Each (function() { $ (this) .css ('width', (((parentLargeur - (marge * 2)) - (bordure * 2))/2) + 'px'); }); la même que celle-ci:. $ ("element.twoinone entrée"), chaque fonction (() {$ (ce) Css ('largeur', ((($ (ce) .Parent().width() - (margin * 2)) - (border * 2))/2) + 'px'); }); – revive

Répondre

2

Lorsque vous êtes en déclarant ceci:

parentWidth = $(this).parent().width(); 

Vous n'êtes pas obtenir la largeur du parent de cet élément (le <input>), il utilise document pour this, puisque c'est le contexte que vous » Vous devez obtenir la largeur à l'intérieur de la fonction, soit à l'intérieur de chacun, soit en tant que plugin, mais pas "globalement" comme ceci.

+0

ah .. gotcha .. donc, il n'y a pas moyen de faire une variable en utilisant 'this' et en utilisant cette variable dans une fonction, ayez 'this' == l'élément dans lequel nous sommes à ce moment-là ??? – revive

+0

@revive - Vous pouvez faire '$ (this) .parentWidth()' un raccourci de fonction si vous le souhaitez, comme ceci: '$ .fn.parentWidth = function {return this.parent(). Width(); }; 'Mais je ne suis pas sûr que vous achète beaucoup, donc à vous :) –

+0

n'ont pas encore essayé .. Je veux juste être en mesure d'accéder aux variables dans toutes les fonctions au sein de ce docready ... sera cela accomplir cela? – revive

0

parentWidth n'est pas une variable globale dans la fonction document.ready mais n'est pas une variable globale pour une fonction.

Sauf si vous déclarez cette variable avant la document.ready:
Quelque chose comme ceci:

var parentWidth; 
$(document).ready(function(){ 
parentWidth = $(this).parent().width(); 
.... 

va de même avec les autres 2 variables.

+0

Ce n'est pas le problème, les variables sont accessibles, la portée n'est pas un problème ici :) –

+0

J'ai essayé les deux - en l'ajoutant comme Var avant le docready .. et en changeant aussi le nom de parentWidth à elementWidth .. rien n'a changé et pas les largeurs ont été calculées .. ils calculent correctement quand j'inclus les variables dans chacune des fonctions .. mais, j'espère apprendre un moyen de réutiliser le code mieux que cela LOL: D Merci! – revive

+0

oui je l'ai eu, @ Crazy Crazy vous emmène à la bonne solution. –

0

Essayez de mettre les variables en dehors du $(document).ready()

+0

essayé .. pas de dés .. – revive

Questions connexes