2016-06-17 1 views
1

À plusieurs points de mon code, j'ai besoin de savoir combien de classes .page sont utilisées. Pour le savoir j'utilise $(".page").size() Je veux enregistrer cette information dans une variable. J'ai donc écrit ceci:La fonction .size() jQuery ne fonctionne pas avec une variable

var vari = { 
    *more variables* 
    totalPageCount : $(".page").size() 
}; 

Le problème est que vari.totalPageCount donne toujours 0 retour.

Avec console.log() je reçois ceci:

console.log($(".page").size()); // Return 8 
console.log(vari.totalPageCount); // Return 0 

Edit: Voici un exemple comment je l'utilise.

JS:

var vari = { 

    currentPage : 0, 
    pageAnimations : 0, 
    animationList : ".fade-in, .fade-out", 
    totalPageCount : $(".page").size(), 

}; 

var footer = { 

    html : function(){ 
     var html; 
     var date = this.date(); 

     for(var i=0; i<vari.totalPageCount; i++){ 
      html = '<span class="pageNumber" id="pageNumber">Folie:'+i+' &#8226; '+vari.custom["companyName"]+' &#8226; '+date+'</span>'; 
      $("#normalPage"+i).append(html); 
     } 

     return; 
    } 

}; 

HTML:

<body class="presWrapper"> 
    <div class="pageWrapper"> 
     <div class="page startPage" id="startPage"> 
      <h2 class="mainTitle">Lorem</h2> 
      <h4 class="subTitle">Ipsum</h4> 
     </div> 
    </div> 
    <div class="pageWrapper"> 
     <div class="page normalPage" id="normalPage1"> 
      <div class="content"> 
       <p class="fade-in">HELLO WORLD</p> 
      </div> 
     </div> 
    </div> 
    <div class="pageWrapper"> 
     <div class="page endPage" id="endPage"> 
      <div class="content">  
       <p class="fade-out">HELLO SATURN</p> 
       <p class="fade-out">HELLO WORLD</p> 
       <p class="fade-in">HELLO WORLD</p> 
       <p>pTag</p> 
      </div>  
     </div> 
    </div> 
</body> 

Toutes les suggestions pour résoudre ce problème?

+0

Pouvez-vous fournir une démo reproductible? – nicael

+2

La propriété 'totalPageCount' devrait être une fonction et FYI, vous devriez utiliser la propriété' length' de l'ensemble jQuery: 'totalPageCount: function() {return $ ('. Page'). Length; } 'Et puis:' console.log (vari.totalPageCount()); '. Au moins, quoi que vous fassiez en manipulant le DOM, vous êtes sûr qu'il retournera le bon nombre attendu –

+0

@ A.Wolff c'est une bonne suggestion. S'il vous plaît poster comme une réponse – wmash

Répondre

0

Cela incrémenter count pour chaque élément à avoir la classe page

var count = 0; 
$('.page').each(function() { 
    count++; 
}); 

var vari = { 
    totalPageCount: count 
}; 

travail jsFiddle

0

The .size() method is deprecated as of jQuery 1.8.

Utilisez length bien à la place:

var vari = { 
    *more variables* 
    totalPageCount : $(".page").length; 

}; 

Assurez-vous également que vous utilisez ce code au bas du script ou à l'intérieur d'un gestionnaire prêt document. Vous n'obtiendrez pas d'informations précises si vous essayez de l'obtenir avant que DOM soit entièrement configuré.

4
  • vari.totalPageCount Obtient une évaluation uniquement lorsqu'il est déclaré. Par conséquent, il aura uniquement la valeur $(".page").size() lors de sa première exécution.

À moins que vous attendez le document prêt les enfants de .page ont pas encore été ajouté et il a une longueur 0. Lorsque vous appelez la console et exécutez le sélecteur plus tard - vous obtenez le nombre vrai dans le message de la console - mais la valeur stockée a déjà été calculée comme 0 dans vari.

longueur() et size() sont des fonctions équivalentes dans jquery mais la taille est déconseillée si la longueur est la fonction appropriée à appeler. Mais dans les deux cas - il est probable que vous évaluiez la longueur trop tôt lorsque l'objet vari est construit pour qu'il ait une valeur significative.

Est-ce que ce qui suit vous donne la mauvaise valeur de la propriété:

$(document).ready(function() { 
    var vari = {totalPageCount: $('.page').length}; 
    console.log(vari.totalPageCount); 
}); 

Relevant documentation

+0

Je viens d'essayer et tout ce que je reçois est indéfini. Mais avec .size() cela fonctionne. – MORHERO