2016-04-04 24 views
0

我使用jQuery的同位素,並試圖改變一個div類HTML文本,與changeMe,基於/其他問題的if/else:jQuery的同位素,如果使用的indexOf

var $chofval = $(".changeMe").html(filterAttr); 

// search if it contains these strings 
if ($chofval.indexOf("*") >= 0) { 
    $(".changeMe").html("All Apples"); 
} else if ($chofval.indexOf(".green") >= 0) { 
    $(".changeMe").html("Green Apples"); 
} 

但它給*.green點擊按鈕。任何猜測我錯在哪裏?

全碼:

<script> 
function getHashFilter() { 
    // get filter=filterName 
    var matches = location.hash.match(/filter=([^&]+)/i); 
    var hashFilter = matches && matches[1]; 
    return hashFilter && decodeURIComponent(hashFilter); 
} 

$(function() { 
    var $container = $('.isotope'); 

    // bind filter button click 
    var $filterButtonGroup = $('.filter-button-group'); 
    $filterButtonGroup.on('click', 'button', function() { 
     var filterAttr = $(this).attr('data-filter'); 
     // set filter in hash 
     location.hash = 'filter=' + encodeURIComponent(filterAttr); 

     var $chofval = $(".changeMe").html(filterAttr); 

     // search if it contains these strings 
     if ($chofval.indexOf("*") >= 0) { 
      $(".changeMe").html("All Apples"); 
     } else if ($chofval.indexOf(".green") >= 0) { 
      $(".changeMe").html("Green Apples"); 
     } 
    }); 

    // bind filter on select change 
    $('.filters-select').on('change', function() { 
     // get filter value from option value 
     var filterValue = this.value; 
     // use filterFn if matches value 
     filterValue = filterFns[ filterValue ] || filterValue; 
     $container.isotope({ filter: filterValue }); 
    }); 

    var isIsotopeInit = false; 

    function onHashchange() { 
     var hashFilter = getHashFilter(); 
     if (!hashFilter && isIsotopeInit) { 
      return; 
     } 
     isIsotopeInit = true; 
     // filter isotope 
     $container.isotope({ 
      itemSelector: '.offer-type', 
      layoutMode: 'fitRows', 

      // use filterFns 
      filter: filterFns[ hashFilter ] || hashFilter 
     }); 
     // set selected class on button 
     if (hashFilter) { 
      $filterButtonGroup.find('.is-checked').removeClass('is-checked'); 
      $filterButtonGroup.find('[data-filter="' + hashFilter + '"]').addClass('is-checked'); 
     } 
    } 

    $(window).on('hashchange', onHashchange); 

    // trigger event handler to init Isotope 
    onHashchange(); 
}); 
//@ sourceURL=pen.js 
</script> 

回答

0
if(filterAttr == "*") {  
    $(".Me").html("All Apples");  
} 
else if(filterAttr == ".green") { 
    $(".changeMe").html("Green Apples"); 
} 
0

此行改變「.changeMe」與filterAttr的值的內容和不能retunr「.changeMe」對象的內容的價值。

var $chofval = $(".changeMe").html(filterAttr); 

,如果你想獲得「.changeMe」的內容,以評估使用:

var $chofval = $(".changeMe").html(); 

但是,如果你想獲得entitiy的屬性值.changeMe定義爲filterAttr使用方法:

var $chofval = $(".changeMe").attr(filterAttr); 

終於還是如果filterAttr是檢查,使用這個值中的一句話來評價它的真正價值:

if(filterAttr.indexOf("*") >= 0){ 
    $(".changeMe").html("All Apples"); 
} else if(filterAttr.indexOf(".green") >= 0){ 
    $(".changeMe").html("Green Apples"); 
} 

查看JQuery Attr