Php html和css中的选项卡式输入
我有一个关于使用html和css进行web开发的问题,下面是: 我使用html和css创建了一个水平选项卡式输入。访问此页面的URL为。用户看到一行选项卡,水平选项卡栏下方有一个巨大的空间。现在,当用户单击其中一个选项卡时,我必须在这个空间中绘制各种html组件。有谁能告诉我如何才能做到这一点?我的意思是,在同一个网页中绘制组件Php html和css中的选项卡式输入,php,html,css,Php,Html,Css,我有一个关于使用html和css进行web开发的问题,下面是: 我使用html和css创建了一个水平选项卡式输入。访问此页面的URL为。用户看到一行选项卡,水平选项卡栏下方有一个巨大的空间。现在,当用户单击其中一个选项卡时,我必须在这个空间中绘制各种html组件。有谁能告诉我如何才能做到这一点?我的意思是,在同一个网页中绘制组件 谢谢 有几种方法可以影响选项卡,这取决于您选择的几个因素 如果您有需要隔离的轻量级内容,您可以简单地输出所有选项卡的内容HTML,隐藏除所选选项卡以外的所有选项卡。为此
谢谢 有几种方法可以影响选项卡,这取决于您选择的几个因素 如果您有需要隔离的轻量级内容,您可以简单地输出所有选项卡的内容HTML,隐藏除所选选项卡以外的所有选项卡。为此,您需要观察选项卡链接并采取适当的行动 但是,如果每个选项卡上都有需要生成查询或大量处理的内容,则不希望一次输出所有选项卡,但可以使用AJAX在单击时加载每个选项卡的内容 编辑:示例
<html>
<head>
<script type="text/javascript">
// <!--
function showTabs(currentTab) {
var tabs = document.getElementsByClassName('tab_content');
if (tabs.length == 0) {
return;
}
for(var i = 0; i < tabs.length; i++) {
if(tabs[i].id != currentTab) {
tabs[i].style.display = 'none';
} else {
tabs[i].style.display = '';
}
}
}
window.onload = function() {
showTabs('general');
document.getElementById('general_link').onclick = function() { showTabs('general'); return false; };
document.getElementById('special_link').onclick = function() { showTabs('special'); return false; };
};
// -->
</script>
</head>
<body>
<a id="general_link" href="javascript:void()">General</a> — <a id="special_link" href="javascript:void()">Special</a>
<div id="general" class="tab_content">
general contents
</div>
<div id="special" class="tab_content">
special contents
</div>
</body>
</html>
//
&mdash;
一般内容
特别内容
非常感谢!我很感激!