2014-03-03 6 views
6

Ich habe diese jsFiddle http://jsfiddle.net/Yvk9q/9/ gefunden, die Isotope verwenden, um das gewünschte Element zu Beginn zu bringen.
Ich habe versucht, diese Coda auf meiner Seite zu kopieren, aber es funktioniert nicht!
Ich habe wirklich keine Ahnung, warum $ elem.hasClass keine Funktion ist (Ich gebe zu, dass ich noch nie zuvor $ elem benutzt habe)
Kann mir jemand helfen, das zu lösen?
Danke!

jQuery(document).ready(function($) { 

       var $container = $('#homepage-grid'); 
       $container.imagesLoaded(function(){ 
        $container.isotope({ 
         itemSelector: 'article', 
         masonry: { 
          columnWidth: 125 
         }, 
         getSortData : { 
          milk : function($elem) { 
           var isMilk = $elem.hasClass('milk'); 
           return (!isMilk?' ':''); 
          }, 
          eggs : function($elem) { 
           var isEggs = $elem.hasClass('eggs'); 
           return (!isEggs?' ':''); 
          }, 
          bacon : function($elem) { 
           var isBacon = $elem.hasClass('bacon'); 
           return (!isBacon?' ':''); 
          } 
         } 
        }); 
       }); 

       var $optionSets = $('#main-nav .option-set'), 
          $optionLinks = $optionSets.find('a'); 

         $optionLinks.click(function(){ 
         var $this = $(this); 
         // don't proceed if already selected 
         if ($this.hasClass('selected')) { 
          return false; 
         } 
         var $optionSet = $this.parents('.option-set'); 
         $optionSet.find('.selected').removeClass('selected'); 
         $this.addClass('selected'); 

         // make option object dynamically, i.e. { filter: '.my-filter-class' } 
         var options = {}, 
          key = $optionSet.attr('data-option-key'), 
          value = $this.attr('data-option-value'); 
         // parse 'false' as false boolean 
         value = value === 'false' ? false : value; 
         options[ key ] = value; 
         if (key === 'layoutMode' && typeof changeLayoutMode === 'function') { 
          // changes in layout modes need extra logic 
          changeLayoutMode($this, options) 
         } else { 
          // otherwise, apply new options 
          $container.isotope(options); 
         } 

         return false; 
       }); 

      }); 
+1

versuchen (Elem $) mit '$' –

+0

Sie haben eine * nicht-jQuery * Objekt, vielleicht ein DOM-Element oder ein anderer "überraschender" Wert, der keine hasClass-Methode unterstützt. Verwenden Sie die Entwicklertools, um zu überprüfen, was $ elem * wirklich * an der Ausnahmeseite ist. – user2864740

+0

Deine Geige scheint gut zu funktionieren! Und '$ elem' ist keine neue Sache, es ist nur ein HTML-Objekt, das du als Argument an yout' milk(), bacon() .. 'etc übergeben kannst, um' .hasClass() 'you need' [ Object object] 'also versuche mit' $ (elem) '! –

Antwort

23

$elem ist kein JQuery-Objekt. Wenn Sie verwenden hasClass wollen (die nur auf JQuery-Objekt aufgerufen werden kann), dann sollten Sie es auf JQuery-Objekt konvertieren mit $($elem)

+1

Danke, ich werde es versuchen. Kannst du mir sagen warum in der jsFiddle das funktioniert und auf meiner Seite nicht? –

+0

Ich habe versucht, es funktioniert nicht, aber der Fehler verschwindet :) Vielen Dank! –

+1

Es kann sein, dass "$ elem" leer ist –