1

我有这个 javascript 代码，我想让第一个链接（选项卡）处于活动状态，这样当有人访问该网站时可以看到它处于活动状态。同样，当单击下一个选项卡/链接时，第一个（活动选项卡/链接）必须将自身转换为普通选项卡/链接（非活动），依此类推！

这是Javascript：

<script type="text/javascript">
    function forumhome_tabs_switch(switch_id){
        document.getElementById('forumhome_tabs_switch_content').innerHTML =
        document.getElementById(switch_id).innerHTML;
    }
</script>

这是 HTML 代码：

<td style="cursor:pointer;" onclick="javascript: forumhome_tabs_switch('forumhome_tabs_$forum[forumid]'); return false;">
    <a href="#" tabindex="2" onclick="javascript: forumhome_tabs_switch('forumhome_tabs_$forum[forumid]'); return false;">$forum[title]</a>  
</td>

它不是这样的：

<li><a href="#">1</li> 
<li><a href="#">2</li> 
<li><a href="#">3</li>
...

也不能那样做。这就是我需要帮助的原因。上面的代码将 3 个链接转换为 3 个选项卡，因此每个选项卡都会打开页面的一部分。我只想将第一个选项卡显示为活动状态，直到单击第二个选项卡。

PD 另外，我想将“a”（链接）中的“onclick”传递给 javascript 代码。那可能吗？

4

1 回答 1

0

我想这就是你的意思？如果你愿意，我可以继续。http://jsfiddle.net/ftM2b/1/ 本质上，当单击另一个时，三个“选项卡”会改变状态。你可以很容易地把它变成一个带有页面的标签系统。

HTML

<a class="tab" id="Tab1">Tab1</a>
<a class="tab" id="Tab2">Tab2</a>
<a class="tab" id="Tab3">Tab3</a>

JAVASCRIPT

$(function(){
$(".tab").click(function() {
$(".tab").css("background-color","blue");
$(this).css("background-color","red");
});
});

CSS

.tab{
width: 40px;
height: 20px;
background-color: blue;
}
#Tab1{
background-color: red;
}
于 2013-03-21T05:08:36.057 回答