<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. centos7时间同步

    用ntpdate从时间服务器更新时间 1.如果你的linux系统根本没有ntpdate这个命令 yum install -y ntp 2.安装完了之后,你不要做什么配置,也不需要,直接测试一下 [ro ...

  2. 洛谷 P4016负载平衡问题【费用流】题解+AC代码

    洛谷 P4016负载平衡问题 P4014 分配问题[费用流]题解+AC代码 负载平衡问题 题目描述 GG 公司有n个沿铁路运输线环形排列的仓库,每个仓库存储的货物数量不等.如何用最少搬运量可以使 n ...

  3. 去掉chrome浏览器中input获得焦点时的带颜色边框呢

    可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}

  4. IOS 使用cocoapods后无法导入头文件问题

    IOS 使用cocoapods后无法导入头文件问题 这时候如果你发现import的时候没有提示AFN e t wo r k i n g.h的文件,可以在target-Build Settings下修改 ...

  5. POJ - 1797 Heavy Transportation 单源最短路

    思路:d(i)表示到达节点i的最大能运输的重量,转移方程d(i) = min(d(u), limit(u, i));注意优先队列应该以重量降序排序来重载小于符号. AC代码 #include < ...

  6. (转载)SVM-基础(五)

    作为支持向量机系列的基本篇的最后一篇文章,我在这里打算简单地介绍一下用于优化 dual 问题的 Sequential Minimal Optimization (SMO) 方法.确确实实只是简单介绍一 ...

  7. yum仓库详细解读

    Yum:Yellowdog Updater,Modified的简称,起初由yellow dog发行版的开发者Terra Soft研发,用Python编写,后经杜克大学的Linux@Duke开发团队进行 ...

  8. JAVA多线程与并发学习总结

    1.      计算机系统 使用高速缓存来作为内存与处理器之间的缓冲,将运算需要用到的数据复制到缓存中,让计算能快速进行:当运算结束后再从缓存同步回内存之中,这样处理器就无需等待缓慢的内存读写了. 缓 ...

  9. PHP stream_context_create()作用和用法分析

    stream_content_create 创建并返回一个文本数据流并应用各种选项,可用于fopen(),filegetcontents()等过程的超时设置.代理服务器.请求方式.头信息设置的特殊过程 ...

  10. 【php】windows安装PHP5.5+Apache2.4

    php5.5和apache2.4的整合 看到php的版本升级了,就想试下新的特性 一.准备下载的文件 apache2.4.9 http://www.apachelounge.com/download/