如果元素具有已動態添加類，然後做

Question

我已經通過我願做一個檢查功能添加類的元素..

如果元素有類，然後顯示另一個元素

我有一個if else語句，我認爲會工作，但class =「selected」似乎只在頁面不動態改變類時才起作用。

即時通訊使用jquery同位素作爲過濾工具，這是添加選定的類，如果有幫助。

if ($("#comingsoonfilter").hasClass('selected')){ //this gets dynamically added 
    $("#datesorter").css({ 
     'display' : 'block' 
    }); 
} else { 
    $("#datesorter").css({ 
     'display' : 'none' 
    }); 
} 

HTML

<div class="filter big"> 
    <p>Filter Schemes:</p> 
    <ul id="filters" class="option-set clearfix" data-option-key="filter"> 
     <li><a href="#filter" data-option-value="*" class="selected">All Schemes</a></li> 
     <li><a href="#filter" data-option-value=".comingsoon" id="comingsoonfilter">Coming Soon</a></li> 
    </ul> 
    </div> 
    <div class="filter"> 
    <p>View by:</p> 
    <ul id="sort-by" class="option-set clearfix" data-option-key="sortBy"> 
     <li><a href="#sortBy=original-order" data-option-value="original-order" class="selected" data>Date Added</a></li> 
     <li><a href="#sortBy=name" data-option-value="name">Alphabetical</a></li> 
     <li><a href="#sortBy=price" data-option-value="price">Price</a></li> 
     <li><a href="#sortBy=date" data-option-value="date" id="datesorter">Date</a></li> 
    </ul> 

答：

不得不解僱一些功能在相同的部分被添加.selected類的javascript的整個部分的位這部分（包括同位素在下面），如果有人卡住了。

$(function() { 
    var $container = $('.scheme-archive'); 
    $checkboxes = $('#cityfilters input'); 
    $container.isotope({ 
     itemSelector : '.scheme', 
        getSortData : { 
      price : function($elem) { 
       return parseFloat($elem.find('.price').text().replace(/[\£\,]/g, ''), 1000); 
      }, 
      date : function($elem) { 
       return $elem.find('.date').text(); 
      }, 
      name : function ($elem) { 
       return $elem.find('.name').text(); 
      } 
     } 
    }); 

    $checkboxes.change(function() { 
     var filters = []; 
     // get checked checkboxes values 
     $checkboxes.filter(':checked').each(function(){ 
      filters.push(this.value); 
     }); 
     filters = filters.join(', '); 
     $container.isotope({ filter: filters }); 
    }); 

    var $optionSets = $('#options .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' } 
     // Show/hide the date sorter 
    if ($('.selected').is('#comingsoonfilter')){ 
       $('#datesorter').show(); 
     } else { 
      $('#datesorter').hide(); 
     } 
     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; 
    }); 
}); 

Answer 1

爲什麼不嘗試在添加'selected'類的地方使用$('#datesorter').toggle();？