0
Итак, я пытаюсь использовать <div> на этой вкладке jQuery и при обновлении страницы содержимое div отображается нормально. Но когда я переключаюсь с одной вкладки на другую и обратно, содержимое исчезает. Я не знаю, почему это происходит.Содержимое Div исчезает на вкладках jQuery после нажатия?
<script type="text/javascript">
$(document).ready(function(){
$('#tabs > div').hide();
$('#tabs div:first').show();
$('#tabs ul li:first').addClass('active');
$('#tabs ul li a').click(function(){
$('#tabs ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#tabs div').hide();
$(currentTab).show();
return false;
});
});
</script>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
#tabs {
font-size: 80%;
margin: 10px 0;
}
#tabs ul {
width: 600px;
padding-top: 2px;
}
#tabs li {
margin-left: 30px;
list-style: none;
}
* html #tabs li {
display: inline;
}
#tabs li, #tabs li a {
float:left;
}
#tabs ul li.active {
border-top:2px #8B6914 solid;
background-color: #a09069;
}
#tabs div {
background: #a09069;
clear: both;
padding: 8px;
min-height: 720px;
}
#tabs div h3 {
margin-bottom: 20px;
}
#tabs div p {
line-height: 150%;
}
#tabs ul li a {
text-decoration: none;
padding: 8px;
color: #000;
font-weight: bold;
font-size: 22;
}
-->
</style>
</head>
<body>
<div id="container">
<div id="tabs">
<ul>
<li><a href="#tab-1">DC Boards</a></li>
<li><a href="#tab-2">RP Boards</a></li>
</ul>
<div id="tab-1">
<br><br><center><font size="17">Title 1</font></center><hr>
<div>Test</div>
</div>
<div id="tab-2">
<br><br><center><h1>Title 2</h1></center><hr><br>
<div>Test</div>
</div>
'