<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>Document</title>

  <style>

    ul>li {

      background-color: #999;

      margin: 20px;

    }

    ul>li.active{

      background-color: greenyellow;

    }

  </style>

  <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>

</head>

<body>

  <ul id="demo">

    <li>1</li>

    <li>2</li>

    <li>3</li>

    <li>4</li>

  </ul>

</body>

<script>

  $(function(){

    $('#demo>li').on('click',function(){

      $(this).addClass('active');

      $(this).siblings().removeClass('active');

    })

  })

</script>

</html>

jq切换选择项的更多相关文章

  1. Js获取下拉框当前选择项的文本和值

    现在有一个Id为AreaId的下拉框,要获取它当前选择项的文本和值有以下方法: <span class="red">* </span> 地       区: ...

  2. magento currency magento头部增加币种切换选择

    magento currency magento头部增加币种切换选择 默认magento 货币选择切换是显示在左边 有时候我们需要让其显示在头部 Step 1. Create a new file a ...

  3. Chosen中选择项的更新

    Chosen 选择项的动态修改/更新 如果你需要去动态更新select选择框里的选择项,你需要通知Chosen去响应这个变动,你需要在这个选项框是触发一个"liszt:updated&quo ...

  4. iOS开发——UI篇&下拉弹出列表选择项效果

    下拉弹出列表选择项效果 右边菜单中的按键,点击弹出一个列表可选择,选择其中一个,响应相应的事件并把文字显示在右边的菜单上:弹出下拉效果使用LMDropdownView插件,可以用POD进行加载pod  ...

  5. C# winform 选择项 省市连动

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  6. selenium 定位input输入框下的选择项

    今天的问题与下图中的类似 这是一个input型输入框,当我点击或输入值时,输入框下方会显示选择项帮助快速输入,代码如下: <input class="v-input some" ...

  7. CentOS6.9-zabbix3.2启动失败原因及页面没有mysql选择项

     环境内核信息: [root@zabbix- ~]# uname -a Linux lodboyedu- -.el6.x86_64 # SMP Tue Mar :: UTC x86_64 x86_64 ...

  8. WPF中使用后台代码来控制TreeView的选择项（SelectedItem）以及展开节点操作

    首先为TreeView控件制作一个Style: <Style x:Key="LibraryTreeViewItemStyle" TargetType="{x:Typ ...

  9. springMVC 复选框带有选择项记忆功能的处理

    前言:由于jsp管理页面经常会遇到复选框提交到JAVA后台,后台处理逻辑完成后又返回到jsp页面,此时需要记住jsp页面提交时复选框的选择状态,故编写此功能! 一.复选框的初始化 1.1.jsp页面 ...

随机推荐

  1. php phar反序列化任意执行代码

    2018年 原理一.关于流包装stream wrapper大多数的文件操作允许使用各种URL协议去访问文件路径,如data://,zlib://,php://例如常见的有include('php:// ...

  2. u盘使用记录、痕迹删除技巧方法

    在日常生活的使用U盘过程当中,系统会记录下大量U盘的使用记录信息,那么接下来小编就来同大家分享介绍如何删除掉这些使用记录的方法知识. 1. 往系统里面添加环境变量devmgr_shownonprese ...

  3. delphi日期GMT格式

    function TForm1.DateTimeToGMT(const DateTime: TDateTime): string;const WEEK: array[1..7] of PChar = ...

  4. 51nod 1437：迈克步 单调栈基础题

    1437 迈克步 题目来源: CodeForces 基准时间限制:1 秒 空间限制:131072 KB 分值: 80 难度:5级算法题  收藏  取消关注 有n只熊.他们站成一排队伍,从左到右依次1到 ...

  5. React+Flask打造前后端分离项目开发环境

    目录 前言 Backend-Flask Frontend-React Done References 前言 新的一年,开始水第一篇技术文.碰巧最近React玩得多,撸一篇文章纪念一下开发环境的搭建.

  6. Jinja2语法小记

    jinja2模板语法小记 Jinja2模板中文文档 三种常见界定符 表达式 {{ ... }} 用于装载字符串.变量.函数调用等 语句 {% ... %} 用于装载控制语句,比如if判断.for循环等 ...

  7. 开源DDD设计模式框架YMNNetCoreFrameWork第四篇-增加YMNSession，增加异常处理，增加策略授权

    1.增加YMNSession,可以获取当前登录的用户信息 2.增加异常处理,不要使用过滤器,过滤器只能获取到mvc异常 3.增加策略授权,策略授权支持用户角色.用户名授权,初步实现 代码地址:http ...

  8. js加密（十三）zzxt.hee.gov.cn md5

    1. url: http://zzxt.hee.gov.cn/ 2. target: 登录加密 3. 简单分析: 这个应该很容易就能找到加密的js,直接拿出来就好. 4. js: /* * md5 * ...

  9. ubuntu12.04 安装完XRDP显示空白桌面

    先放链接:http://c-nergy.be/blog/?p=3518 在ubuntu软件中心搜索:fallback session,安装gnome-session-fallback: 在主文件夹(h ...

  10. webpack散记---代码分割 和 懒加载

    webpack methods ES 2015 Loader spec (1)webpack methods方法 require.ensure //可以动态加载依赖 []:dependencies / ...