脚本保持“运行在圈子中”
问题描述:
建设FAQ小部件并陷入了最小化当前问题的困境。问题开关工作正常。但是,当我试图尽量减少当前未解决的问题时,它会开始“循环运行”(我猜测)。因为当我在代码之后添加警报时,它的行为方式应该是这样,但是在警报关闭后,它回到它的原始状态脚本保持“运行在圈子中”
它的HTML
<div class="faqttlitem faqttlitem3">
<div class="acfaqttl acfaqttl3">Question</div>
<div class="mobfaqcont mobfaqcont3">
<div class="mobfaqaccontimg mobfaqaccontimg3 w100">
<img src="//cdn.shopify.com/s/files/1/0213/3764/t/38/assets/faq_img3.jpg?6062394605562480157"></div>
<div class="mobfaqacconttxt mobfaqacconttxt3">answer text here</div>
</div>
</div>
和JS
if ($(window).width()< 801){
$(".faqttlitem").each(function(){
$(this).click(function(){
if ($(this).hasClass('activefaq')) {
$(this).removeClass('activefaq');
$(this).find('.mobfaqcont').hide();
//alert('wtf'); doesn't work without it
} else {
$(this).parent().find(".activefaq").removeClass("activefaq");
$(this).parent().find(".activefaq").find(".mobfaqcont").hide();
$(this).addClass('activefaq');
$(this).find(".mobfaqcont").show();
}
});
});
} else {}
答
的代码似乎很好地工作。
但是为了以防万一,因为你的每本功能离子是不必要的。如果您对功能为jQuery的元素做了一个,他绑定功能,每一个元素,而这是在每一个不同的,所以对于性能问题做如下修改:
if ($(window).width() < 801) {
$(".faqttlitem").on('click', function() {
if ($(this).hasClass('activefaq')) {
$(this).removeClass('activefaq');
$(this).find('.mobfaqcont').hide();
} else {
$(this).parent().find(".activefaq").removeClass("activefaq");
$(this).parent().find(".activefaq").find(".mobfaqcont").hide();
$(this).addClass('activefaq');
$(this).find(".mobfaqcont").show();
}
});
} else {}
你的代码似乎很好地工作: http://jsfiddle.net/ncxqjfqg/ – Brandon 2015-04-02 21:46:50
也从removeClass中删除点,您只需要在这里传递名称$(this).parent()。find(“.activefaq”)。removeClass(“.activefaq”) ; – 2015-04-02 21:51:10