class h5 点击后样式变化_【php】JQuery怎么实现页面刷新后保留鼠标点击addclass的样式?...

刚开始是这个效果

12bda9cfb285c752df30d704b8854059.png

鼠标点击之后变成了这个效果

4d3b84c90400fdde0f1551167b9495ec.png

要保证实现 a 标签点击链接一个新的网址

同时也要保证效果达到

我目前写的网站代码 可以下载

http://115.com/file/c2zlhblv

看看

回答

感谢所以回答问题的人。

比较好的办法是使用url传参数,然后根据参数判断是否有必要显示class

但是更好的办法是下面这段JS

$('ul.main-menu li a').each(function(){

if($($(this))[0].href==String(window.location))

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

});

利用

一般来说这个还是怡红公子所说的由后台写入current后再处理比较合理。

必须要求纯前台实现的话,页面载入后需要做一次判断来决定是否对指定按钮展开/高亮。

要么用判断当前地址的方式,用地址来匹配需要处理的按钮;要么在按钮点击事件中添加把本按钮的id写到cookie里的操作函数。

前者突出“当前页”这一概念逻辑,但需要在js中额外维护一份地址-按钮对应表或对应规则。

后者就不是当前页的概念了,就是纯粹的指示,但是对禁止cookie的浏览器就无奈了。

常规的做法还是对比地址比较多,特别是按钮id与地址之间的对应关系比较简单的话。

比如 1.html -> id=”btn1″ 之类的……

1. 用ajax加载内容页面 , 同时打开菜单 .. 就是说页面不跳转

2. 用iframe显示内容也 , 同样页面不跳转

3. 在页面中控制 链接的样式 , 比如当前页面 是业务报表页面 , 那么就控制这个菜单 的class 为 active…类似这样吧

出个下下策:

修改addClass/removeClass等系列函数,把每次操作计入cookie,到新的页面读取cookie,把所有操作再做一遍……

iframe吧

a标签中的链接做一下处理呗,例如 /content.html ==> /content.html?tab=1

这个参数对后台没有用,但是会留在地址栏里,用window.location.href可以取到

在页面加载的过程中解析url,看看有没有tab的参数,有就addClass

鼠标点击之后修改url增加个参数&currentMenu=当前菜单的id,刷新时再判断处理

这个可以用jquery的cookie保存当前填写的需要设置的状态,然后在加载完根据cookie设置即可

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/562314.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

《零基础》MySQL DELETE 语句(十五)

语法 以下是 SQL DELETE 语句从 MySQL 数据表中删除数据的通用语法: DELETE FROM table_name [WHERE Clause] 如果没有指定 WHERE 子句,MySQL 表中的所有记录将被删除。你可以在 WHERE 子句中指定任何条件您可以在单个表中一次性删除记录。 当你想删除…

java 获得站点地址_JavaWeb项目里面的路径获取方法总结

仅为资源搬运,个人还未充分理解...request.getRealPath不推荐使用request.getRealPath("") 这个方法已经不推荐使用了,那代替它的是什么方法 Deprecated. As of Version 2.1 of the Java Servlet API, use ServletContext.getRealPath(java.la…

《零基础》MySQL LIKE 子句(十六)

我们知道在 MySQL 中使用 SQL SELECT 命令来读取数据, 同时我们可以在 SELECT 语句中使用 WHERE 子句来获取指定的记录。 WHERE 子句中可以使用等号 来设定获取数据的条件,如 "runoob_author RUNOOB.COM"。 但是有时候我们需要获取 runoob…

《零基础》MySQL UNION 操作符(十七)

描述 MySQL UNION 操作符用于连接两个以上的 SELECT 语句的结果组合到一个结果集合中。多个 SELECT 语句会删除重复的数据。 语法 MySQL UNION 操作符语法格式: SELECT expression1, expression2, ... expression_n FROM tables [WHERE conditions] UNION [ALL …

《零基础》MySQL 排序(十八)

我们知道从 MySQL 表中使用 SQL SELECT 语句来读取数据。 如果我们需要对读取的数据进行排序,我们就可以使用 MySQL 的 ORDER BY 子句来设定你想按哪个字段哪种方式来进行排序,再返回搜索结果。 语法 以下是 SQL SELECT 语句使用 ORDER BY 子句将查询…

java序列化错在哪里_Spark序列化错误:java.io.NotSerializableException

由于spark算子用到的class没有实现序列化,报错如下所示15/11/23 14:43:47 ERROR Executor: Exception in task 0.0 in stage 4.0 (TID 4)java.io.NotSerializableException: EntityMentionSerialization stack:- object not serializable (class: EntityMention, va…

《零基础》MySQL GROUP BY 语句(十九)

GROUP BY 语句根据一个或多个列对结果集进行分组。 在分组的列上我们可以使用 COUNT, SUM, AVG,等函数。 GROUP BY 语法 SELECT column_name, function(column_name) FROM table_name WHERE column_name operator value GROUP BY column_name; 实例演示 本章节实例使用到了…

字谜 java_java - 2字的字谜 - 堆栈内存溢出

我正在练习java和一些算法,所以我想创建一个程序来查看2个单词是否是彼此的字谜。 我的方法是使用快速排序对单词进行排序,然后查看它们是否匹配。 我测试了我的quicksort功能,它似乎工作。 也许我的字谜功能错了? 我测试了我的代…

基于java jsp+mybatis+Spring+的SSM二手交易网站设计实现

🍅 作者主页:Java李杨勇 🍅 简介:Java领域优质创作者🏆、Java李杨勇公号作者✌ 简历模板、学习资料、面试题库、技术互助【关注我,都给你】 🍅 欢迎点赞 👍 收藏 ⭐留言 &#x1f…

《零基础》MySQL 连接的使用(二十)

在前几章节中,我们已经学会了如何在一张表中读取数据,这是相对简单的,但是在真正的应用中经常需要从多个数据表中读取数据。 本章节我们将向大家介绍如何使用 MySQL 的 JOIN 在两个或多个表中查询数据。 你可以在 SELECT, UPDATE 和 DELETE…

怎么设置internet才能下载JAVA_如何使用Java从Internet下载和保存文件?

我需要获取一个在线文件(例如http://www.example.com/information.asp )并将其保存到目录中。 我知道有几种逐行捕获和读取在线文件(URL)的方法,但是有没有一种方法可以使用Java下载和保存文件?#1楼import java.io.*;import java.net.*;public class fil…

热榜!基于jsp+mysql的JSP在线水果销售商城系统设计实现【建议收藏】

🍅 作者主页:Java李杨勇 🍅 简介:Java领域优质创作者🏆、Java李杨勇公号作者✌ 简历模板、学习资料、面试题库、技术互助【关注我,都给你】 🍅 文末获取源码联系方式 📝 研究意…

java log4j权限被否定_SLF4J简介与使用(整合log4j)

一、概念SLF4J的全称是Simple Logging Facade for Java,即简单日志门面。SLF4J并不是具体的日志框架,而是作为一个简单门面服务于各类日志框架,如java.util.logging, logback和log4j。SLF4J提供了统一的记录日志的接口,对不同日志…

《springcloud超级入门》微服务的概念和优缺点《一》

微服务是什么?它的优缺点有哪些? “微服务”一词来源于 Martin Fowler 的《Microservices》一文。微服务是一种架构风格,即将单体应用划分为小型的服务单元,微服务之间使用 HTTP 的 API 进行资源访问与操作。 在笔者看来&#xf…

安卓 php环境 app,安卓系统lighttpd-php-mysql本地环境

这是一个可在安卓手机上布置的服务器环境,功能组件包括:lighttpd、php和mysql,能成功运行DZ等php程序,安装和配置过程十分简单,也许现在该是讨论用什么手机做服务器更合适的时候了。演示图片为一成功运行的服务器环境探…

硬核!从0到1学习Spring Cloud微服务章节《建议收藏》

为什么要使用学习springcloud以及他的优势? Spring Cloud 来源于 Spring,质量、稳定性、持续性都可以得到保证。 spirng Cloud 天然支持 Spring Boot,更加便于业务落地。 Spring Cloud 是 Java 领域最适合做微服务的框架。相比于其它框架&…

《springcloud超级入门》Spring Cloud是什么?Spring Cloud版本介绍《二》

Spring cloud是一系列框架的有序集合。它利用 Spring Boot 的开发便利性,巧妙地简化了分布式系统基础设施的开发,如服务注册、服务发现、配置中心、消息总线、负载均衡、断路器、数据监控等,这些都可以用 Spring Boot 的开发风格做到一键启动…

《springcloud超级入门》Spring Cloud和Dubbo的区别及各自的优缺点《三》

了解为什么需要微服务。最初的服务化解决方案是给相同服务提供一个统一的域名,然后服务调用者向这个域发送 HTTP 请求,由 Nginx 负责请求的分发和跳转。 这种架构存在很多问题:Nginx 作为中间层,在配置文件中耦合了服务调用的逻辑…

php完美导出word,PHP使用phpword生成word文档

使用phpword生成文档有两种方式直接使用代码编写word文档,用代码生成word,但是设置样式,格式,图片非常麻烦,不建议使用。如果客户或产品提供一份word的样式,我们也难以完全复原,调样式很头疼的。…

《springcloud超级入门》Spring Cloud开发环境的准备和Lombok安装步骤《四》

开发环境的准备主要涉及三个方面:JDK、Maven、Spring Tools 4 for Eclipse。 1. JDK JDK 的版本用 1.8 即可,环境变量大家自行去配置。配置好环境变量,在命令行中输入“java–version”能够显示出版本信息即可,如图 1 所示。 …