效果出现次数

来源：2-8 编程练习

小巧的蜗牛

2018-06-08 16:39:11

请问老师，好奇怪哦，为什么只能触发一次事件，鼠标移入移出

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        ul{
            cursor:pointer;
        }
        .red{
         color: red;
        }
        .yellow{
         color: yellow;
        }
        .blue{
         color: blue;
        }
        .pbg{
         background-color: red;
        }
        .obg{
         background-color: white;
        }
    </style>
</head>
<body>
       <p>我是div元素前面的第一个p</p>
    <div>
        <p>第一个P元素</p>
        <p>第二个P元素</p>
        <p>第三个P元素</p>
        <p>第四个P元素</p>
    </div>
<script type="text/javascript" src="lib/zepeto.min.js"></script>
<script type="text/javascript">
   $(document).ready(function () {
    // body...
     $('div p').on('mouseover',function(){
     
          $(this).addClass('pbg');  
     });


      $('div p').on('mouseout',function(){
     
          $(this).addClass('obg');  
     });

   })


</script>


</body>

写回答

1回答