当仅将。悬停时,如何添加更多类来触发?
例如:将鼠标悬停在.button a上会将类添加到另一个对象。

jQuery('.button a').hover(

    function () {
        jQuery(this).parent().parent().parent().addClass('over');
    },
    function () {
        jQuery(this).parent().parent().parent().removeClass('over');
    }
);

最佳答案

我将使用 jquery data并执行以下操作:



    jQuery('.button a').hover(

    function () {
        jQuery(this).parent().parent().parent().addClass('over');
        var target1 = jQuery('.elem a').addClass('small');
        var div1 = jQuery('.first-div').addClass('firstdiv');
        var div2 = jQuery('.second-div').addClass('seconddiv');

        $(this).data('first', div1);
        $(this).data('second',div2);
        $(this).data('target',target1);

    },
    function () {
        jQuery(this).parent().parent().parent().removeClass('over');
        $(this).data('target').removeClass('small');
        $(this).data('first').removeClass('firstdiv');
        $(this).data('second').removeClass('seconddiv');
    }
    );

    .over {
      font-weight: Bold;
      font-size: 40px;
    }

    .small {
      font-style: italic;
      font-size: 12px;
    }

    .firstdiv{
      color: red;
    }

    .seconddiv {
      color: green;
    }
  .first-div, .second-div {
    font-size: 18px;
    font-weight: normal;
  }

  .changefont {
    font-size: 30px;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="button">

    <a href="#"> BIG</a>
    </div>
    <div class="elem">

    <a href="#">ME TOO</a>
    </div>
   <div class="first-div">
    First Div
    </div>
    <div class="second-div">
    Second Div
    </div>





编辑:
我添加了额外的div来演示用法,以防其他人最终出现在这里。

关于javascript - jQuery将类更改为多个div,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/39625748/

10-10 01:19