V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
regent
V2EX  ›  JavaScript

能否请各位帮忙实现这样一个页面跳转功能?

  •  
  •   regent · 2012-05-18 20:20:14 +08:00 · 3910 次点击
    这是一个创建于 4570 天前的主题,其中的信息可能已经有所发展或是发生改变。
    是这样的,我想在我的博客中加入这样一个功能,
    就是一个按今天是星期几来播放不同的音乐这样的功能

    比如说用户此时的时间是星期一上午,那么就打开1.html这个页面,页面上已经放好了我选择的歌曲
    如果是星期一下午就打开2.html,星期二上午打开3.html……如果是周末则打开weekend.html

    现在这些html我都已经做好了,目前的方式把一堆链接列在一个页面里,让用户自己点击比如“星期一上午”这个链接
    (没办法,就是业余爱好者,技术有限,要是从头开始去钻研太多技术学习成本太高,所以目前这样实现)

    能不能请帮忙哪位写一下代码,帮我实现:当用户点击“我要听歌”这个链接之后,按照用户当前的时间跳转到上述我做好的网页,实现之后,”我要听歌“这个链接就可以放在很多地方了,这样的话我觉得用户体验可能会更好一些(虽然只是个人博客,不过也觉得用户体验要好一些)

    谢谢!!!
    23 条回复    1970-01-01 08:00:00 +08:00
    mkeith
        1
    mkeith  
       2012-05-18 21:14:38 +08:00
    js 可以实现吧,一个页面就行了。
    lackrp
        2
    lackrp  
       2012-05-18 21:33:30 +08:00   ❤️ 1
    var now = new Date();
    var weekday = now.getDay();
    if (weekday >= 1 && weekday <= 5) {
    return (weekday * 2 - (now.getHours() < 12 ? 1 : 0)) + '.html';
    } else {
    return 'weekend.html';
    }
    fanzheng
        3
    fanzheng  
       2012-05-18 21:33:55 +08:00   ❤️ 1
    <script type="text/javascript">
    document.write("<a href=\"");
    var day = new Date();
    var cur = day.getDay();
    document.write(cur);
    document.write(".html\">linkname</a>");
    </script>

    把你的链接换成这个,音乐页面的html,如果是周一的话是1.html 周5是5.html ,一个个测试下吧。
    regent
        4
    regent  
    OP
       2012-05-18 22:44:59 +08:00
    @lackrp 谢谢你的回复
    @fanzheng 谢谢,你的回复对我更好懂些,我试试看,有其他问题会继续请教的
    @mkeith 是,不过我自己不懂,所以来v2ex求助
    xxwd001
        5
    xxwd001  
       2012-05-18 22:50:20 +08:00   ❤️ 1
    综合一下LS两位的就更好了
    <script type="text/javascript">
    document.write("<a href=\"");
    var day = new Date();
    var cur = day.getDay();
    if(cur>=1 && cur<=5){
    document.write(cur);
    document.write(".html\">linkname</a>"); //linkname,链接文字
    } else{
    document.write("weekend.html\">linkname</a>");
    }
    </script>
    lackrp
        6
    lackrp  
       2012-05-18 23:14:06 +08:00
    @regent 别客气,祝好运 :)

    @fanzheng , @xxwd001 星期一下午是2.html哦~ 哈哈,还是你们的方法比较简单
    regent
        7
    regent  
    OP
       2012-05-18 23:20:16 +08:00
    @xxwd001 @fanzheng 刚刚发现,二位的方法没有考虑到上午、下午的情况,能否加入呢?

    @lackrp 不好意思,没有仔细看清楚,确实,你的方法注意到了我的要求,需要考虑上午下午的问题
    dianso
        8
    dianso  
       2012-05-18 23:23:12 +08:00
    js很容易搞定的,按楼上几位说的做吧
    regent
        9
    regent  
    OP
       2012-05-18 23:58:10 +08:00
    @xxwd001 @fanzheng @lackrp 音乐展示的话按星期几判断已经足够了,而且对于技术不高的我来说其实已经足够方便,之所以又希望加入上午、下午的判断,是因为我发现这个方法还可以在不用php+mysql那样的方法下,建立一个简单的查找大学空闲教室的功能(前提是已经将空闲教室统计出来了),另外还需要修改一下页面的名称,
    不过我感觉要多加几个判断:

    1、首先要判断是星期几,如果是周末直接跳转weekend.html

    2、如果是星期一到星期五,在此基础上继续判断:时间满足上午八点到中午十二点,跳转到Monday1.html类似这样的页面;时间满足中午十二点到下午2点,全部跳转到zhongwu.html;时间满足下午2点到下午六点,跳转到Monday2.html这样的页面;时间满足下午六点到晚上十一点,统一跳转evening.html;其他情况,统一跳转night.html

    各位觉得怎么样?另外跳转的html名是不是最好和函数的返回值一样会比较好写?
    lackrp
        10
    lackrp  
       2012-05-19 00:11:48 +08:00
    @regent 文件名还是叫monday_morning.html(或者1_morning.html), noon.html, monday_afternoon.html(或者1_afternoon.html), evening.html, night.html吧,拼音和英文混杂,看起来很奇怪
    xxwd001
        11
    xxwd001  
       2012-05-19 00:16:15 +08:00
    @regent 方法还是一样的,现在用手机登录的,叫@lackrp帮你解决吧!
    xxwd001
        12
    xxwd001  
       2012-05-19 00:18:27 +08:00
    汗…忘了空格了
    regent
        13
    regent  
    OP
       2012-05-19 01:32:43 +08:00
    @lackrp 开始也打算用noon,不过又看到一个地方说过noon指正午,所以就用拼音了
    xxwd001
        14
    xxwd001  
       2012-05-19 12:25:10 +08:00   ❤️ 1
    @regent
    <script type="text/javascript">
    document.write("<a href=\"");
    var day = new Date();
    var cur = day.getDay();
    var hour=day.getHours();
    if(cur==6 || cur==0){
    document.write("weekend.html\">linkname</a>");
    } else{
    if(hour>=8 && hour<12){
    document.write("Monday1.html\">linkname</a>");
    } else if(hour>=12 && hour<14){
    document.write("zhongwu.html\">linkname</a>");
    } else if(hour>=14 && hour<18){
    document.write("Monday2.html\">linkname</a>");
    } else if(hour>=18 && hour<23){
    document.write("evening.html\">linkname</a>");
    } else{
    document.write("night.html\">linkname</a>");
    }
    </script>
    xxwd001
        15
    xxwd001  
       2012-05-19 12:57:53 +08:00
    @regent 最后的</script>前面少了一个 }
    gDD
        16
    gDD  
       2012-05-19 13:20:14 +08:00   ❤️ 1
    bcxx
        17
    bcxx  
       2012-05-19 13:25:14 +08:00
    @livid #reply15 的 gist 挤爆了~
    regent
        18
    regent  
    OP
       2012-05-19 14:03:02 +08:00
    @xxwd001 谢谢,v2ex的用户真的很热心,
    不过if(hour>=8 && hour<12){document.write("Monday1.html\">
    这里应该是把Monday Tuesday等都作为变量,也就是周一到周五的上下午时要单独处理的,中午晚上等有统一跳转,上午跳转类似Tuesday1.html,下午跳转Tuesday2.html


    @gDD 哇,非常感谢,还让我知道了v2ex还支持这种方式贴代码,另外jsfiddle.net是一个在线测试JavaScript的网站吗?原来还有这种服务啊,读了你的代码,配合我上面提出的,具体实现上有这样几点问题:

    1、除周末外的时间,也就是周一到周五,noon,evening,night是统一跳转的,因为直接跳转到例如night.html,而不是Monday_night.html这样的,

    2、周末所有时间全部跳转weekend.html,不必再细分

    我之所以这样提出,是因为我们学校发布的公开信息只有周一到周五的,周末、周一到周五的中午和晚上等这样的情况,进行统一跳转可以减少页面制作量(因为即便制作了也是一样的,就是名称不同),不过你的代码对我很有学习价值,对于一周所有时间都有安排的情况是适用的,再次感谢
    gDD
        19
    gDD  
       2012-05-19 14:15:04 +08:00
    @regent #18

    page = map[day] + "_" + getDayPostfix(hr);
    的后面一行加上
    page.replace(/(\w+?_)(noon|evening|night)/, "$2")
    就行了。
    虽然知道你要的代码和我写的有出入,但我还是写成了更通用点的,导致现在很难改成你想要的,不过加上上面那行就行了,算是一个dirty hack吧。
    gDD
        20
    gDD  
       2012-05-19 14:16:12 +08:00
    错了,应该是
    page = page.replace(/(\w+?_)(noon|evening|night)/, "$2");
    lackrp
        21
    lackrp  
       2012-05-19 16:58:49 +08:00
    lackrp
        22
    lackrp  
       2012-05-19 16:59:33 +08:00
    sorry,点错了
    qiuai
        23
    qiuai  
       2012-05-19 18:22:52 +08:00
    直接获取星期,然后加在PHP文件的函数后面不就是了?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1173 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 18:26 · PVG 02:26 · LAX 10:26 · JFK 13:26
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.