<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<style>
ul{
list-style: none;
}
ul li{
float: left;
padding: 10px;
border: 1px solid black;
margin-right: 10px;
}
.active{
background: green;
color: white;
}
</style>
<div class="delivery-tab">
<ul>
<li class="active">普通</li>
<li>文件</li>
<li>易碎</li>
<li>数码</li>
<li>美食</li>
<li>鲜花</li>
<li>蛋糕</li>
<li>生鲜</li>
</ul>
</div>
<script>
$('.delivery-tab ul li').click(function () {
$(this).addClass('active').siblings().removeClass('active');
$(this).siblings().children('input').removeAttr('checked', true);
});
</script>

jquery切换的更多相关文章

  1. jQuery切换网页皮肤保存到Cookie实例

    效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/25.htm 以下是源代码: <!DOCTYPE html PUBLIC "-//W3C//D ...

  2. jquery切换tab标签例子

    之前做了一个简单的小效果,使用jquery方式,让tab标签切换,效果如下 代码其实很简单,首先先把代码分享给大家,代码如下 var shoptoggle = $('.shoptoggle .shop ...

  3. jQuery切换网页皮肤并保存到Cookie示例代码

    经过使用,靠谱! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  4. jQuery切换事件

    有html页面内容如下: <body> <h5 id="hh">关于jQuery的介绍</h5> <p id="p1" ...

  5. jQuery 切换图片(图标)效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. jQuery——切换toggle

    toggle()-----显示隐藏 toggleClass-------添加类或者删除类 <!DOCTYPE html> <html lang="en"> ...

  7. jquery切换class

    <ul class="nva_sele_txt" id="">            <a href="#" class= ...

  8. jQuery实现的鼠标滑过切换图片代码实例

    jQuery实现的鼠标滑过切换图片代码实例:有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍 ...

  9. 10 款基于 jQuery 的切换效果插件推荐

    本文整理了 10 款非常好用的 jQuery 切换效果插件,包括平滑切换和重叠动画等,这些插件可以实现不同元素之间的动态切换. 1. InnerFade 这是一个基于 jQuery 的小插件,可以实现 ...

随机推荐

  1. angularjs 指令详解

    一.指令定义 对于指令,可以把它简单的理解成在特定DOM元素上运行的函数,指令可以扩展这个元素的功能. 首先来看个完整的参数示例再来详细的介绍各个参数的作用及用法: <div my-direct ...

  2. [翻译] 编写高性能 .NET 代码--第二章 GC -- 减少分配率, 最重要的规则,缩短对象的生命周期,减少对象层次的深度,减少对象之间的引用,避免钉住对象(Pinning)

    减少分配率 这个几乎不用解释,减少了内存的使用量,自然就减少GC回收时的压力,同时降低了内存碎片与CPU的使用量.你可以用一些方法来达到这一目的,但它可能会与其它设计相冲突. 你需要在设计对象时仔细检 ...

  3. Hibernate学习(三)一对多数据的保存

    保存习惯代码 @Test public void saveTwoTableTest(){ Transaction transaction = null; try { transaction = ses ...

  4. 关于Mysql5.7高版本group by新特性报错

    一个项目的开发到测试上线运营,团队对项目的管理不成熟会影响项目的开发效率.由于项目是我刚接手,独自在Centos搭建PHP环境,所以就考虑使用高版本,选择了Mysql5.7,本地开发环境还是Windo ...

  5. Linux下yum安装MysqL数据库

    1.命令安装mysql # yum install mysql mysql-server mysql-devel -y 最后提示 Complete!  表示安装成功 2.查看是否生成了mysqld服务 ...

  6. 【BZOJ1834】 网络扩容

    Time Limit: 1000 ms   Memory Limit: 128 MB Description 给定一张有向图,每条边都有一个容量C和一个扩容费用W.这里扩容费用是指将容量扩大1所需的费 ...

  7. Android中Activity被系统会收前页面信息保存

    1.重写onSaveInstanceState方法 protected void onSaveInstanceState(Bundle outState) { super.onSaveInstance ...

  8. 顺便说说webservice

    webservice这玩意框架也挺多的.就这玩意我知道cxf,axis2,jersey.通过jdk也能产生webservie.感觉这东西太多,有时间知道点就写点吧.先挖坑在此

  9. TOE(TCP/IP Offload Engine)网卡与一般网卡的区别

    TCP减压引擎,第一次听说这个名词,但是并不是一个新的概念了,若干年前听说过设备厂商在研究在FPGA之中实现TCP Stack,但是后来没有听到任何的产品出来,应该是路由设备to host的traff ...

  10. R语言︱情感分析—基于监督算法R语言实现(二)

    每每以为攀得众山小,可.每每又切实来到起点,大牛们,缓缓脚步来俺笔记葩分享一下吧,please~ --------------------------- 笔者寄语:本文大多内容来自未出版的<数据 ...