脚本保持“在圈子里跑”

时间:2015-04-02 21:36:01

标签: javascript jquery html

构建常见问题解答小部件并陷入最小化当前问题。问题开关工作正常。但是当我尝试最小化当前打开的问题时,它开始“在循环中运行('我在猜测)。因为,当我在代码之后添加警报时,它的行为方式应该如此,但在警报关闭后,它是回到原来的状态

它的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 {}

1 个答案:

答案 0 :(得分:0)

代码似乎工作正常。

但是以防万一,因为你的每个功能都是不必要的。如果你在jQuery元素中执行on函数,他会将函数绑定到每个元素,并且每个元素都有所不同,因此对于性能问题,请执行以下更改:

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 {}