jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery – 更改所选菜单选项卡的颜色大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我从另一个问题中抓住了这个片段:
<script type='text/javascript' >
$(document).ready(function () {
 $("div.content ul li a")
 .mouSEOver(function () {
  var t = $(this);
  if (!t.hasClass("clicked")) {  // very easy to check if element has a set of styles
   t.addClass('mouSEOver');
  }
 })
 .mouSEOut(function () {  // attach event here instead of inside mouse over
  $(this).removeClass('mouSEOver');
 });

 $("div.content ul li a").click(function () {
  var t = $(this);
  t.toggleClass("clicked");
  if (t.hasClass("clicked")) {
   t.removeClass('mouSEOver');
  } else {
   t.addClass('mouSEOver');
  }
 });
});
</script>

我想要的最后一件事是在单击另一个选项卡时恢复标签正常css.
例如,当我点击tab1时,标签的bgcolors为白色.当我进入Tab2时,它变为黑色.Tab1变为白色,Tab2变为黑色

<ul> 
 <li>
  <a href="#Tab1">Tab 1</a>
 </li>
 <li>
  <a href="#Tab2">Tab 2</a>
 </li>
</ul>

让我们说这是CSS部分

ul li a {BACkground-color: white;}
ul li a.mouSEOver {BACkground-color: black;}
ul li a.mouSEOut {BACkground-olor: white;}
ul li a.clicked {BACkground-color: black;}

解决方法

实际上,你可以大大简化你的Javascript.这应该达到你想要的效果.
<script type="text/javascript">
    $(document).ready(function() {
        $("div.content ul li a")
         .mouSEOver(function() {
             $(this).addClass('mouSEOver');
         })
         .mouSEOut(function() {
             $(this).removeClass('mouSEOver');
         });

        $("div.content ul li a").click(function(E) {
            e.preventDefault(); //prevent the link from actually navigaTing somewhere
            $(this).toggleClass("clicked");
            $("div.content ul li a").not(this).removeClass("clicked"); //remove the clicked class from all other elements
        });
    });
</script>

这里的Javascript将执行以下操作:

>悬停链接添加“鼠标悬停”类>当您不再悬停链接时,删除“mouSEOver”类>当您单击某个链接时,它将切换“已点击”类并将其从可能具有该类的任何其他链接删除 – 这会将其他标签恢复为“正常”状态.

大佬总结

以上是大佬教程为你收集整理的jquery – 更改所选菜单选项卡的颜色全部内容,希望文章能够帮你解决jquery – 更改所选菜单选项卡的颜色所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。