Question

我正在努力弄清楚为什么这不再有效。

.on（点击）根本不会发射。我试过console.log，警报，什么都没有。我需要第二双眼睛看这个。

JS：

var $gridStore;
$(document).ready(function() {

    $('[data-toggle="popover"]').popover(); 

    //testing
    var currentPage = document.location.href;

    if (currentPage.match(/outfits\/$/) || currentPage.match(/outfits\/[a-z-#]+$/)) {
        if ($(window).width() > 992) {
            $('div#side-nav').show();
        } else {
            $('div#side-nav-mb').show();
        }
        $('ul#letter-subcategories').hide();
        $('ul li.main-nav').removeClass('active');
        $('li#menu-outfits').addClass('active');
    } else if (currentPage.match(/outfits\/[a-z-]+/)) {
        $('div#side-nav-mb').hide();
        $('div#side-nav').hide();
        $('ul#letter-subcategories').hide();
        $('ul li.main-nav').removeClass('active');
        $('li#menu-outfits').addClass('active');
    } else if (currentPage.match(/directory/)) {
        $('div#side-nav-mb').hide();
        $('div#side-nav').hide();
        $('ul#letter-subcategories').show();
        $('ul li.main-nav').removeClass('active');
        $('li#store-directory').addClass('active');
    } else if (currentPage.match(/magazine/)) {
        $('div#side-nav-mb').hide();
        $('div#side-nav').hide();
        $('ul#letter-subcategories').hide();
        $('ul li.main-nav').removeClass('active');
        $('li#magazine').addClass('active');
    } else if (currentPage.match(/models/)) {
        $('div#side-nav-mb').hide();
        $('div#side-nav').hide();
        $('ul#letter-subcategories').hide();
        $('ul li.main-nav').removeClass('active');
        $('li#models').addClass('active');
    } else {
        $('div#side-nav-mb').hide();
        $('div#side-nav').hide();
        $('ul#letter-subcategories').hide();
        $('ul li.main-nav').removeClass('active');
    }

    //initialize isotope
    $gridStore = $('#store-listings');
    $gridStore.isotope({
        itemSelector: '.store-listing-item',
        masonry: {
            columnWidth: '.store-listing-item'
        }
    });

    $('div.row').has($('div.carousel')).css('margin-left', '-15px');
    $('div.row').has($('div.carousel')).css('margin-right', '-15px');
});

$(window).load(function() {
    var $grid = $('#outfits');
    $grid.isotope({
        itemSelector: '.outfit-item',
        layoutMode: 'fitRows',
        filter: '*'
    });
    $grid.imagesLoaded().progress( function() {
        $grid.isotope('layout');
    });
});

$('ul.store-subcats li.subfilter a').each(function() {
    var clickedFilter;
    $gridStore = $('#store-listings');
    $(this).on('click', function() {
    clickedFilter = $(this).attr('data-filter');
    alert('i am clicked' + clickedFilter);
    if ( clickedFilter !== '*' ) {
        clickedFilter = clickedFilter + ', .stamp';
    }
    $gridStore.isotope({ filter: clickedFilter });
    location.hash = encodeURIComponent( clickedFilter.replace(/.(number-|letter-)/i, '').replace(/, .stamp/i, '') );
    $('ul.store-subcats li.subfilter').removeClass('active');
    $(this).parent().addClass('active');
});
//$('span.how-many-stores').text();
var isIsotopeInit = false;
function onHashchange() {
    var hashFilter = getHashFilter();
    var newFilter;
    if ( !hashFilter && isIsotopeInit ) {
        return;
    }
    isIsotopeInit = true;
    if (hashFilter == 'number') {
        newFilter = '.number-' + hashFilter;
    } else {
        newFilter = '.letter-' + hashFilter;
    }
    // filter isotope
    $gridStore.isotope({
        itemSelector: '.store-listing-item',
        masonry: {
            columnWidth: '.col-md-12'
        },
        filter: newFilter + ', .stamp'
    });
}
$(window).on( 'hashchange', onHashchange );
// trigger event handler to init Isotope
onHashchange();
});
$('ul.store-subcats li.letter-all a').on('click', function() {
    $gridStore = $('#store-listings');
    $gridStore.isotope({ filter: '*' });
    removeHash();
    $('ul.store-subcats li.subfilter').removeClass('active');
    $(this).parent().addClass('active');
});

感谢您的帮助。

Answer 1

您定义onclick函数的块最后缺少}); - 它应该如下所示：

$('ul.store-subcats li.subfilter a').each(function() {
  var clickedFilter;
  $gridStore = $('#store-listings');
  $(this).on('click', function() {
    clickedFilter = $(this).attr('data-filter');
    alert('i am clicked' + clickedFilter);
    if ( clickedFilter !== '*' ) {
      clickedFilter = clickedFilter + ', .stamp';
    }
    $gridStore.isotope({ filter: clickedFilter });
    location.hash = encodeURIComponent( clickedFilter.replace(/.(number-|letter-)/i, '').replace(/, .stamp/i, '') );
    $('ul.store-subcats li.subfilter').removeClass('active');
    $(this).parent().addClass('active');
  });
});

Answer 2

首先，检查您的类选择器（在您单击时引发的循环结果）。你确定它会返回一些东西吗？应该为选择器选择的每个元素引发单击，如果它没有返回任何内容，请确保点击永远不会发生

点击不工作 - jquery

2 个答案: