1、HTML代码,如下图:

<p class="sc_member_recharge_form">
<span class="selected">20元</span>
<span >50元</span>
<span >100元</span>
<span >200元</span>
<span >300元</span>
<span >其它金额</span>
</p>

2、jQuery代码,如下图:

<script>
$(document).ready(function(){
$(".sc_member_recharge_form span").click(function(){
var select = $(this).text();
if(select === 'other amount' || select === '其它金额'){
$(".sc_member_recharge_form span").removeClass("selected");
$(this).addClass("selected");
}else{
$(".sc_member_recharge_form span").removeClass("selected");
$(this).addClass("selected");
} });
});
</script>

jQuery实现单击某个标签改变样式的更多相关文章

  1. javascript和jquery 移除事件 和 改变样式

    javascript移除事件: document.getElementById("word").onmouseover = null; javascript改变样式: docume ...

  2. jquery获取和失去焦点改变样式

    第一种:(文本框获取焦点后,它的颜色会有所变化,当失去焦点的时候,恢复为原来的样子) <html> <meta http-equiv="Content-Type" ...

  3. 标签(改变样式style)

    id可以换为class,class对应的名字可以多个一样 <div class="box">box1</div> <div class="b ...

  4. 用JS改变页面中b标签的样式啊 样式的等

    用JS改变页面中b标签的样式啊 样式的等    ,实际上是在标签内加上样式 ,用媒体查询的话 ,不能生效 <!DOCTYPE html> <html lang="en&qu ...

  5. 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式

    查看本章节 查看作业目录 需求说明: 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式 ...

  6. jQuery入门(2)使用jQuery操作元素的属性与样式

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  7. [置顶] JQuery实战总结三 标签页效果图实现

    在浏览网站时我们会看到当我们鼠标移到多个选项卡上时,不同的选项卡会出现自己对应的界面的要求,在同一个界面上表达了尽量多的信息.大大额提高了空间的利用率.界面的切换效果也是不错的哦,这次自己可以实现啦. ...

  8. JQuery实战总结三 标签页效果图实现

    在浏览网站时我们会看到当我们鼠标移到多个选项卡上时,不同的选项卡会出现自己对应的界面的要求,在同一个界面上表达了尽量多的信息.大大额提高了空间的利用率.界面的切换效果也是不错的哦,这次自己可以实现啦. ...

  9. 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式

    本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...

随机推荐

  1. Mongodb副本集--Out of memory: Kill process 37325 (mongod)

    1.Mongodb副本集--Out of memory: Kill process 37325 (mongod) 场景描述: 恢复一个22TB数据的mongodb实例的时候. 将备用结点加入mongo ...

  2. 使用Advanced Installer制作IIS安装包(二:配置安装包依赖项和自定义dll)

    前言:上篇使用Advanced Installer制作IIS安装包(一:配置IIS和Web.config)介绍了下使用Advanced Installer配置IIS和Web.config的过程,操作起 ...

  3. Sql 语句拼接 多条件分页查询

    Create PROCEDURE [dbo].[Proc_B2B_GetBatchMainPaging] @StationNo AS varchar() , --m @StationName AS v ...

  4. 2016年Scrum状态调查报告

    背景 Scrum是一种迭代式增量软件开发过程,通常用于敏捷软件开发,包括一系列实践和预定义角色的过程骨架.Scrum由Jeff Sutherland和Ken Schwaber在一次IBM项目合作中研究 ...

  5. ado.net的简单数据库操作(一)

    摘要:接下来的几篇博客将要讲到如何使用ado.net实现简单的数据库操作,包括增删改等内容.首先会介绍基础的数据库操作,然后以一个实例来进行讲解,这个实例会把一个数据表读取到winform上,然后在w ...

  6. Android破解学习之路(十三)—— 另类的破解VIP思路

    前言 一般按照以往,我们想要获得某个软件的VIP,一般是通过修改支付宝的支付流程,原本购买失败的,我们修改代码,从而使得失败变成了成功,不花费金钱 另类思路 有些软件将判断用户是否为VIP的代码写在了 ...

  7. JavaScript 的 4 种数组遍历方法: for VS forEach() VS for/in VS for/of

    我们有多种方法来遍历 JavaScript 的数组或者对象,而它们之间的区别非常让人疑惑.Airbnb 编码风格禁止使用 for/in 与 for/of,你知道为什么吗? 这篇文章将详细介绍以下 4 ...

  8. vue的项目结构记录

    vue的项目结构 不知道大家有没这样的情况,面对刚配置好的脚手架,创建的文件不知道该放哪个文件下,导致后面开发一些文件不好找,不利于维护. 接下来我说说我项目中的一些文件: 首先是components ...

  9. cSharp:反射 Reflection

    /// <summary> /// 利用反射调用插件方法 /// 涂聚文(Geovin Du) /// 2019-03-27 /// /// </summary> /// &l ...

  10. 后台返回excel文件流,js下载

    /** 下载excel */ downloadExcel(data: Blob): void { var blob = new Blob([data], { type: 'application/vn ...