<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. php获取今日开始时间戳和结束时间戳

    1.php获取今日开始时间戳和结束时间戳  $beginToday=mktime(0,0,0,date('m'),date('d'),date('Y'));$endToday=mktime(0,0,0 ...

  2. python进阶学习笔记(一)

    python进阶部分要学习的内容: 学习目标: 1.函数式编程 1.1,什么是函数式编程 函数式编程是一种抽象计算的编程模式 不同语言的抽象层次不同: 函数式编程的特点: python支持的函数式编程 ...

  3. Yii2 场景

    下面给大家介绍一下 yii2.0 场景的使用. 现在在 post表里面有 title image content 三个的字段,当我创建一个 post 的时候,我想三个字段全部是必填项,但是你修改的时候 ...

  4. 关于springMVC中component-scan的问题以及springmvc.xml整理

    关于springMVC中component-scan的问题以及springmvc.xml整理 一.component-scan问题和解决办法         最近在学习使用springMVC+myba ...

  5. JPA实体的常用注解

    @Entity 标注于实体类上,通常和@Table是结合使用的,代表是该类是实体类@Table 标注于实体类上,表示该类映射到数据库中的表,没有指定名称的话就表示与数据库中表名为该类的简单类名的表名相 ...

  6. LOJ116 - 有源汇有上下界最大流

    原题链接 Description 模板题啦~ Code //有源汇有上下界最大流 #include <cstdio> #include <cstring> #include & ...

  7. day2(字符串、格式化输出、运算符、流程控制)

    一.字符串 在Python中,加了引号的字符都被认为是字符串! 单引号.双引号.多引号的区别? 单引号和 双引号没有任何区别,但是某种情况下需要单双配合 如 msg = " My name ...

  8. iOS.Animations.by.Tutorials.v2.0汉化

    翻译自:iOS.Animations.by.Tutorials.v2.0 前五章将向你介绍动画API-UIKit框架.这个API是专门设计来帮助你轻松轻而易举的为视图控件赋予生命,同时避免了核心动画的 ...

  9. C#访问修饰符(public,private,protected,internal,sealed,abstract)

    为了控件C#中的对象的访问权限,定义对象时可以在前面添加修饰符. 修饰符有五种:private(私有的),protected(受保护的),internal(程序集内部的),public(公开的),以及 ...

  10. ClientToScreen 和ScreenToClient 用法

    ClientToScreen( )是把窗口坐标转换为屏幕坐标 ScreenToClient( )是把屏幕坐标转换为窗口坐标 屏幕坐标是相对于屏幕左上角的,而窗口坐标是相对于窗口用户区左上角的 VC下, ...