ace admin中类似iframe的效果如何实现的
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ace admin中类似iframe的效果如何实现的相关的知识,希望对你有一定的参考价值。
我在他们的主页点击左边的菜单,视觉上来看,是右边那块需要显示数据的区域被刷新了,其他其余没有变动,但是他们没用iframe等框架,我认为也不是使用ajax的技术,因为点了菜单后,浏览器的地址栏会改变,且浏览器的状态有那麽一瞬间是在加载中,但是我观察了很久,除去显示内容的那块div,菜单,包括工具条都没有刷新过..请问是如何实现的
是使用了pjax技术,在获取内容的同时,可以更改页面title、浏览器history、浏览器地址栏,可前进后退。前端具体实现有jquery.pjax.js等,后端可以根据ajax、X-PJAX、普通访问作不同的response 参考技术A 使用ajax技术浏览器的地址不会变的,如何利用iframe标签以及Javascript制作时钟?
如何利用iframe标签以及Javascript制作时钟?
如何制作一个时钟呢?效果如下图所示:
这里的时钟会不停的走,但是下面的页面是不会变得,这样就实现了我们想要的效果了。下面我将分为以下几个方面来讲:
- javascript中的Date引用类型
- 几种效果不佳的实例
- <iframe>标签
- 最终不错的效果实例
如果大家想直接看最终不错的效果实例,可以直接点击这里。
第一部分:Date引用类型
1.日期对象可以直接使用new操作符和Date构造函数构造。代码如下:
var date=new Date();
2. 通过构造函数直接得到的date对象的时间是当前的时间。由于Date类型使用自UTC(Coordinated Universal Time,国际协调时间)1970年1月1日午夜至改日期经过的毫秒数。所以如果直接输出,按道理来说会出现一个很大的数字。但是因为Date引用类型是继承了Object引用类型的,同时也就继承了Object的toString()方法。故直接输出时,它会默认使用toString()方法。
var date=new Date; console.log(date);// Mon Oct 31 2016 23:29:07 GMT+0800 (中国标准时间)
console.log(date.toString());//Mon Oct 31 2016 23:29:07 GMT+0800 (中国标准时间)
3.如果我们使用valueOf()方法(同样也是继承自Object()引用类型),就可以得到历经的毫秒数了。
var date=new Date();
console.log(date.valueOf());//1477927747916
1477927747916毫秒算下来刚好是46年多。
4.同时,Date还有一个toLocaleString()方法,该方法会将毫秒表示的时间转化为当地的字符串表示的时间,如下所示:
var date=new Date(); console.log(date.toLocaleString());//2016/10/31 下午11:29:07
5.但是如果我们不想使用当前时间而希望使用自定义的时间呢? Date类型为我们提供了两种方法,分别具有不同的初始化方式。
var time=new Date(Date.parse("October 31,2016")); console.log(time);//Mon Oct 31 2016 00:00:00 GMT+0800 (中国标准时间) var Time=new Date("October 31,2016"); console.log(Time);//Mon Oct 31 2016 00:00:00 GMT+0800 (中国标准时间) var dateTime=new Date(Date.UTC(2016,9,31,23,26,50)); console.log(dateTime);//这是一个bug Tue Nov 01 2016 07:26:50 GMT+0800 (中国标准时间) var Timedate=new Date(2016,9,31,23,26,50); console.log(Timedate);//Mon Oct 31 2016 23:26:50 GMT+0800 (中国标准时间)
即这两个方法分别是在构造函数时初始化,一个是Date.parse(),如果输入的格式正确,我们甚至省略之。另外一个是Date.UTC,这里传入了六个参数,分别是 年 月 日 时 分 秒 ,同样是可以省略不写。这里值得注意的是:
- “月”是从0开始计算的,即2月但是要输入1,10月要输入9......
- “时”必须使用24小时的方法来计算。
但是这里有一个bug,即当我们使用var dateTime=new Date(Date.UTC(2016,9,31,23,26,50));传入的数字是9,应该得到10月份,却得到了11月份,这时我们可以采用其他方法来替换之。
第二部分:几种效果不佳的实例
以上是关于ace admin中类似iframe的效果如何实现的的主要内容,如果未能解决你的问题,请参考以下文章
JS组件系列——基于Bootstrap Ace模板的菜单Tab页效果优化
vue-element-admin iframes 组件 保留 iframe 操作状态