简单实现jQuery鼠标按下抬起改变元素css样式
2021-09-17 11:55:55

首先是style部分定义类名，并将想要实现的样式效果写入

​​<style> .blue{ color:blue; } //字体变为蓝色 .red{ color:red; } //字体变为红色 </style>​​

其次是js部分代码，引入jquery，将想要改变的样式类名加入元素或移除元素

​​<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>​​

​​<script> $(document).ready(function(){ $("#p1").mousedown(function(){ $("#p1").addClass("blue"); $("#p1").removeClass("red"); }); $("#p1").mouseup(function(){ $("#p1").addClass("red"); $("#p1").removeClass("blue"); }); }); </script>​​

最后是要改变的html元素，id名为p1

​​<p id="p1">这是一个段落。</p>​​