jQuery javascript procédure de tri personnalisé fonctionne dans Firefox, mais IE ne semble pas l'obtenir ... (copier-coller exemple de code)

J'ai construit cet exemple de code basé sur un vrai problème que j'ai dans une application. J'ai une procédure de tri personnalisée pour trier les tableaux jQuery. Un conteneur contient une liste d'éléments avec des attributs spéciaux.jQuery javascript procédure de tri personnalisé fonctionne dans Firefox, mais IE ne semble pas l'obtenir ... (copier-coller exemple de code)

Pour le tri:

charges tous les éléments dans le tableau de température
Efface le récipient
trie la matrice de température dans un nouveau tableau
append triée des objets à conteneur

D'une certaine manière, Firefox sait comment trier, mais IE ne le fait pas. Quelqu'un peut-il me dire ce qui ne fonctionne pas correctement?

(vous pouvez copier-coller le code HTML ci-dessous dans un fichier .html vide, il devrait fonctionner immédiatement)

<html> 
<head> 
<script type="text/javascript" 
    src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 
    jQuery.fn.sort = function() { 
     return this.pushStack([].sort.apply(this, arguments), []); 
    } 

    function DoTheSort() { 
     //Fetch elements in jQueryElement 
     var sortableArray = $('#sortables').find('div.sortable'); 

     //Clear the sortables container 
     $('#sortables').empty(); 

     //Sort the array 
     var sortedArray = $(sortableArray).sort(sortProcedure); 

     //Append sorted items 
     jQuery.each(sortedArray, function() { 
      alert($(this).attr("sortvalue")); 
      $('#sortables').append(this);     
     }); 
    } 

    function sortProcedure(a, b) { 
    var value1 = parseInt($(a).attr("sortvalue")); 
    var value2 = parseInt($(b).attr("sortvalue")); 
     return value1 > value2; 
    } 


    </script> 
</head> 
<body> 

    <a href="javascript:DoTheSort();">Sort</a> 

    <div id="sortables"> 
     <div class="sortable" sortvalue="5">5</div> 
     <div class="sortable" sortvalue="1">1</div> 
     <div class="sortable" sortvalue="4">4</div> 
     <div class="sortable" sortvalue="1">1</div> 
     <div class="sortable" sortvalue="2">2</div> 
     <div class="sortable" sortvalue="9">9</div> 
     <div class="sortable" sortvalue="3">3</div> 
    </div> 



</body> 
</html>

Source

2009-06-04 Ropstah

Votre procédure de tri est subtilement mal: vous devez tenir compte des égalités ainsi, et boolean n'est pas le bon type de retour (voir addendum).

Pour ce faire:

return value1 - value2;

au lieu de:

return value1 > value2;

Addendum:

La forme générale d'une fonction de comparaison de tri f (A, B) doit revenir > 0 si A> B, < 0 si A < B, et 0 si aucune modification ne doit se produire. Le retour d'un booléen vous attrape par des valeurs falsey ne représentant pas ce que vous pensez qu'ils font.

Source

2009-06-04 11:32:37 annakata

Grande info! Cela ne fonctionnait pas encore dans mon application ... Je remettais le tableau retourné (par la fonction sort) dans la même variable. Cela a foiré les choses ... De toute façon, ça a marché maintenant! – Ropstah

Si ce n'était pas la solution, pourriez-vous s'il vous plaît expliquer comment vous avez corrigé cette erreur. J'ai le même problème. –

juste pour développer une seconde, le problème est que IE sorte suppose 0 pour être égal, un nombre négatif est inférieur à, et un nombre positif est supérieur à. Cela signifie que retourner 0 ou false est interprété différemment dans IE. Chrome, Firefox et l'opéra semblent bien gérer les retours booléens, mais Safari et IE ne le font pas. –

jQuery javascript procédure de tri personnalisé fonctionne dans Firefox, mais IE ne semble pas l'obtenir ... (copier-coller exemple de code)

Répondre

Questions connexes