js layui跳转页面_【WEB前端开辟】layui的iframe跳转链接与页面按钮跳转相干引见...
一、导航跳转iframe页面题目:
引荐:layui教程
关于layui的iframe嵌套页面的导航跳转页面题目,如下图所示能够看到结果:
在模板页的导航代码:
一切商品
- 商品列表
- 商品属性
- 商品分类
- 增加
解决方案
- 列表一
- 列表二
- 超链接
- 云市场
- 宣布商品
有没看到链接那边多了这个东西:
target="main_self_frame"
然后在嵌套的iframe代码中加:
就是加上这个:name=”main_self_frame” ;然后src跳转的链接就是刚上面增加的src链接来的.
二.页面中的按钮跳转到其他导航页面,并高亮显现
做着做着发明了别的一个题目,就是在你的页面中有个按钮,要跳转到对应的模块,直接跳转到对应模块,你们有没发明跳转到的谁人模块,左边的导航并没相对应的显现的谁人地方高亮,照样默许在本来谁人高亮;
结果显现:
按钮跳转以后,别的页面的导航没有高亮显现呀.解决方法照样有的,要经由过程js去掌握跳转:
1、首先在按钮谁人页面html增加:
跳转到商品属性
跳转到商品分类
链接上面加这个类:jump_refresh_url ;然后在该页面js那边加上:
$(".jump_refresh_url").click(function () {
var url = $(this).attr('href');
top.refreshHighlight(url);
});
2、在导航地点的模板页面增加js:
function refreshHighlight(url) {
$ = layui.jquery;
$(".layui-nav[lay-filter='navList'] a").each(function (ind, val) {
if($(this).attr('href') === url){
$('.layui-nav dd').removeClass('layui-this');
$(this).parent('dd').addClass('layui-this');
}
})
}
照上面步骤就可以完成结果了,请看下图结果:
该方法完成的结果请记得在服务器端阅读喔,直接阅读翻开按钮跳转会报错的喔,由于iframe之前的操纵会存在跨域题目,所以要用localhost等翻开,不能直接翻开html,比方webstrom都自带web服务器的,翻开也轻易.localhost翻开的就好了.
以上就是layui的iframe跳转链接与页面按钮跳转相干引见的细致内容,更多请关注ki4网别的相干文章!
js layui跳转页面_【WEB前端开辟】layui的iframe跳转链接与页面按钮跳转相干引见...相关推荐
- html监控页面完成,Web前端开发,利用HTML5 Canvas实现监控系统页面展示
今日我们给大家介绍一下怎么创建一个监控体系的前端部分. 如果你们想要了解或者想要深入学习可以进我的群里进行交流学习,群号:659479860 .欢迎我们进去交流学习,我们一同学习一同行进,我觉得程序员 ...
- Web 前端框架 Layui
Web 前端框架 Layui 1. 模块化前端框架 Layui 2. 在 Web 项目中引入 Layui 框架 3. 网页轮播特效 4. 表格模块和分页模块的使用 1. 模块化前端框架 Layui L ...
- layui表格更改一列数据_【WEB前端开辟】layui表格数据变动的一种处理方式
表格数据更改,平常包括几个内容:新增.修正.删除.挪动,开辟中常常会面对的一个题目就是更改以后怎样将数据同步到节点上,一向以来个人的提议照样应用表格重载,不管是url情势的照样data情势的实际都是须 ...
- html怎么获取页面地址,web前端:JS通过url地址栏获取html页面名称
统一资源定位符(UniformResourceLocator,URL)是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址.互联网上的每个文件都有一个唯一的URL,它 ...
- Web前端优化最佳实践及工具集锦(如减少页面加载时间)
前端的性能对于一个Web应用来说非常重要,如果一个Web应用的页面加载速度非常快.对于用户的操作可以及时响应,那么产品的用户体验将会极大地提升.下图显示了页面加载速度对于用户体验的影响. 你的Web页 ...
- 漂亮的html静态页面demo,web前端里见过最惊艳的HTML5的demo
原标题:web前端里见过最惊艳的HTML5的demo 先给你看一段效果: GIF动态图 写出这个效果需要多少代码量呢? 答案是200行. 你没看错, 不需要C++也不需要Flash,这是纯HTML5页 ...
- layui table 每列加标签_【前端】layui表格中根据条件给对应的列加背景色
[前端]layui表格中根据条件给对应的列加背景色 [前端]layui表格中根据条件给对应的列加背景色 1.效果(根据条件动态给表格加背景色) 2.代码: 在我自己的项目中,由于条件比较多,提取出了一 ...
- display none的元素重新展示如何撑开页面_【第1962期】巧用 display: contents 增强页面语义...
前言 6月1号了,新的一个月.今日早读文章由@chokcoco授权分享. 正文从这开始~~ display: contents 是一个比较陌生的属性,虽然属于 display 这个基本上是最常见的 C ...
- python爬取二级页面_爬虫代码改进(二)|多页抓取与二级页面
本文是下面两篇文章的续篇 本系列包括如下内容抓取豆瓣top250一页多个字段 整合成列表 存储为json文件 定义成函数形式 多页抓取之构造url 多页抓取之翻页 抓取二级页面数据 通过生成器优化代码 ...
最新文章
- oracle错误:ORA-12545
- r语言读取csv文件赋值gamma_tidyfst vs pandas(1):csv文件读写
- Windows下Unity5x的安装
- MATLAB机器学习系列-4函数篇
- 中台之上(十五):被忽视的产品目录
- 最全高考分数线出炉!!查了分后,这届学生为了过线真是太拼了.......
- 关于源码,反码,补码(正数--负数)---------(-128)自己的理解
- conda使用报错:ImportError:DLL load failed
- 测试beta测试_重新想象不断变化的自动化世界中的Beta测试
- C++相对路径下新建文件夹
- 为什么90%的CTO 都做不好绩效管理
- 1分钟读懂人口普查大数据——第七次人口普查数据可视化BI分析
- 分形吧matlab,Matlab在分形模拟上的一些应用
- 全国大学生智能汽车竞赛图像采集处理上位机开源!
- 第四章第四题(几何:六边形面积)(Geometry: area of a hexagon)
- linux下的软件包
- matlab 折线图 标记_MATLAB画图使用不同的线型、点及标记
- 账号管理html,管理员账号.html
- 《Web前端开发之HTML+CSS精英课堂【渡一教育】》文档版笔记(完结)
- '08英雄会——另一角度报道
热门文章
- unity添加对象实例_在Unity中,如何通过值复制一个GameObject,以便在实例化之前修改它?...
- 微信支付宝服务器分布,支付宝微信扫码支付中间件「第二届立创商城电子制作节30强作品」...
- python是面向什么的计算机程序设计语言_Python是一种计算机程序设计语言,python到底该怎么学习...
- java 微信公众号js接入_SpringCloud : 接入 微信公众号平台(三)、获取JsSDK配置参数...
- 媒体转码切片_cVideo云转码系统
- DEBUGGING AND OPTIMIZING MEMORY
- How GPUs Work
- Keras-10 模型可视化
- Python-复习-习题-13
- sbt创建web项目