这个是怎么做到的？

老李

@Ta 2014-06-06 5799点击

网址是http://wap.9acl.com/
像他那样，点击"最新"或者是"随机"后，在不从新加载的情况下变换内容，是怎么做到的？
求代码！求详解！
本人新手，在此致谢！

隐藏样式查看源码

回复列表(18|隐藏机器人聊天)

1

老李

@Ta / 2014-06-06 / 样 / 源

涂鸦的那块！
Screenshot_2014-06-06-09-20-47-1.jpg
2

molf

@Ta / 2014-06-06 / 样 / 源

骨灰级的模板，HTML+css+js
3

老李

@Ta / 2014-06-06 / 样 / 源

@molf，怎么做到的？求代码！谢谢
4

xlm

@Ta / 2014-06-06 / 样 / 源
```
<li onClick="tab(this,'tab-list-8')">最新</li><li onClick="tab(this,'tab-list-8')">随机</li>
```
就是这样，用onClick来调用JavaScript。
另外这个网站的Html极不规范，还好意思用xhtml1-transitional.dtd。
5

胜永

@Ta / 2014-06-06 / 样 / 源

@xlm，没有结尾？？？
6

老李

@Ta / 2014-06-06 / 样 / 源

@xlm，然后呢？底下列表的内容怎么写？CSS呢？本人js一窍不通！麻烦你了！
7

老李

@Ta / 2014-06-06 / 样 / 源

别沉啊！大家来帮帮忙！！！！！
8

xlm

@Ta / 2014-06-06 / 样 / 源

点击过后通过改变 ##li[class] 来改变标签的颜色。
然后把 ##div[id^="tab-list-"] > div[class="list-current"] 改变成 ##div[class=""] ，然后根据选项，把第n个 ##div[class=""] 改为 ##div[class="list-current"] 。
根据css显示的控制，
.tab-list div {
display: none;
}
使 ##div[class=""] 不被显示出来。

xlm

@Ta / 2014-06-06 / 样 / 源

控制的关键js脚本：

function tab(obj, id) {
    var shuzu_li = obj.parentNode.getElementsByTagName("li");
    var shuzu_nr = document.getElementById(id).getElementsByTagName("div");
    for (var i = 0; i < shuzu_nr.length; i++) {
        if (obj == shuzu_li[i]) {
            shuzu_li[i].className = "tab_current";
            shuzu_nr[i].className = "list-current"
        } else {
            shuzu_li[i].className = "";
            shuzu_nr[i].className = ""
        }
    }
}

10

水木易安

@Ta / 2014-06-06 / 样 / 源

其实纯CSS就可以实现。
11

王鸿杰

@Ta / 2014-06-06 / 样 / 源

@泪儿，貌似是js
12

老李

@Ta / 2014-06-06 / 样 / 源

@水木易安，怎么实现，教教我！
13

老李

@Ta / 2014-06-06 / 样 / 源

@水木易安，教教我谢谢！
14

linggan

@Ta / 2014-06-06 / 样 / 源

这里有
lg9.pw@泪儿，
15

宣源

@Ta / 2014-06-07 / 样 / 源

[tab=新帖|精华|热帖|随机][bbs=0_10_1_0_2]|[bbs=0_10_3_0_2]|[bbs=0_10_2_0_2]|[bbs=0_10_5_0_2][/tab]
16

宣源

@Ta / 2014-06-07 / 样 / 源

楼下的高手想的太复杂了，就是几个ubb
17

xggz

@Ta / 2014-06-07 / 样 / 源

页面加载的时候就把数据都取出来了，只是隐藏了而已，当你点击某个标签的时候把这个标签的内容显示出来，把别的标签内容隐藏掉
18

cddchen

@Ta / 2014-06-08 / 样 / 源

@泪儿，你看新浪和腾讯等大型导航都有，好像是ul的css神马做出来的，不懂，也可以用css+js做出来

添加新回复

回复需要登录。