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 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 jsp+mybatis+Spring+的SSM二手交易网站设计实现

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

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

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

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

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

硬核!从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 所示。 …

php 制作ppt,PPT制作三个基本要素是什么?

PPT制作三个基本要素是什么?1、一个PPT只为一类人服务,针对不同听众制作不同层次内容;2、PPT永远是为听者服务;3、PPT只讲一个重点,不要试图在某个PPT中既讲技术,又讲管理。PPT优势1.使用 Microsoft Office…

《SpringCloud超级入门》Spring Boot项目搭建步骤(超详细)《六》

目录 编写第一个 REST 接口 读取配置文件 profiles 多环境配置 热部署 actuator 监控 自定义 actuator 端点 统一异常处理 异步执行 随机端口 编译打包 在 Spring Tools 4 for Eclipse 中选择 File->New->Maven Project, 在 pom.xml 中添加 Spri…

php 常用编译参数,php编译参数,不用怕!!

很多初学者,在编译php的时候,容易被php的编译参数吓到!例如:./configure \--prefix/usr/local/php \--with-config-file-path/usr/local/php/etc \--enable-inline-optimization \--disable-debug \--disable-rpath \--enable-sha…

php设置表单为整数,PHP中如何判断FROM表单提交的数字是否为整数?

在php开发中我们经常需要用表单传递数据,如果我们传递的是整数(int),经过表单传递后,在接收页面整数的数值类型将会变成字符串(string)类型,这样我们就不能用is_int()函数来判断是否为整数,但是我们可以用is_numeric()和strpos()函…

《SpringCloud超级入门》使用Eureka编写服务消费者《十一》

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

java echarts 散点图,echarts在地图上绘制散点图(任意点)

项目需求:在省份地图上绘制散点图,散点位置不一定是哪个城市或哪个区县,即任意点通过查询官网文档,找到一个与需求类似的Demo:https://www.echartsjs.com/gallery/editor.html?cscatter-map,更改代码&…

基于java+springboot+mybatis+laiyu实现学科竞赛管理系统《建议收藏》

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

基于java TCP实现网络通信聊天室《建议收藏附完整源码》

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

ORACLE 12C采坑之 ORA-12541:TNS:无监听程序

目录 1.首先查看oracle12c监听服务是否启动 2. ping 本地id是否能ping通 3.检测配置监听是否有错误: 4.重新配置监听器Net Configuration Assistant 5.之后重启OracleServiceORCL服务 1.首先查看oracle12c监听服务是否启动 2. ping 本地id是否能ping通 3.检测配置监听是否…