i'm fetching data from database to jquery tabs,data is coming but data is repeating.and tabs are also repeating...i want if 3 records are there in my db only three tabs should be here..how to fix this issue....here is my code...
我正在将数据从数据库获取到 jQuery 选项卡，数据来了，但数据在重复，而且选项卡也在重复......我希望如果我的数据库中有 3 条记录，这里应该只有三个选项卡。如何解决此问题....这是我的代码... 我正在将数据从数据库获取到 jQuery 选项卡，数据来了，但数据在重复，而且选项卡也在重复......我希望如果我的数据库中有 3 条记录，这里应该只有三个选项卡。如何解决此问题....这是我的代码...
<?php include("config.php");
$sql="select sd.*,s.title from section_description as sd INNER JOIN sections as s ON s.s_id=sd.s_id";
$res=mysql_query($sql);
?>
<div id="container1">
<div id="parentHorizontalTab" style="display: block; width: 100%; margin: 0px;">
<ul class="resp-tabs-list hor_1">
<li class="resp-tab-item hor_1 resp-tab-active" aria-controls="hor_1_tab_item-0" role="tab" style="border-color: rgb(193, 193, 193); background-color: white;">Introduction</li>
</li>
<li class="resp-tab-item hor_1" aria-controls="hor_1_tab_item-1" role="tab" style="background-color: rgb(245, 245, 245);">Mission</li>
<li class="resp-tab-item hor_1" aria-controls="hor_1_tab_item-2" role="tab" style="background-color: rgb(245, 245, 245);">Vision</li>
</ul>
<div class="resp-tabs-container hor_1" style="border-color: rgb(193, 193, 193);">
<h2 class="resp-accordion hor_1 resp-tab-active" role="tab" aria-controls="hor_1_tab_item-0" style="border-color: rgb(193, 193, 193); background: none;"><span class="resp-arrow"></span><?php echo $row['title'];?></h2><div class="resp-tab-content hor_1 resp-tab-content-active" aria-labelledby="hor_1_tab_item-0" style="display:block">
<p>
<!--vertical Tabs-->
<?php while($row1=mysql_fetch_array($res)) { ?>
<?php echo $row1['description']; ?>
</p>
</div>
<!--<h2 class="resp-accordion hor_1" role="tab" aria-controls="hor_1_tab_item-1" style="border-color: rgb(193, 193, 193); background-color: rgb(245, 245, 245);"><span class="resp-arrow"></span>Mission</h2><div class="resp-tab-content hor_1" aria-labelledby="hor_1_tab_item-1" style="border-color: rgb(193, 193, 193);">
<i>Mission</i> To utilize the latest medical and dental advancements for the sake of providing the finest patient-oriented dental treatment with world class quality and service. Concurrently, insuring continuous broadening of knowledge and skills of all involved healthcare providers, while participating in patient and public education.
</div>
<h2 class="resp-accordion hor_1" role="tab" aria-controls="hor_1_tab_item-2" style="border-color: rgb(193, 193, 193); background-color: rgb(245, 245, 245);"><span class="resp-arrow"></span>Vision</h2><div class="resp-tab-content hor_1" aria-labelledby="hor_1_tab_item-2" style="border-color: rgb(193, 193, 193);">
<i>Vision</i> To utilize the latest medical and dental advancements for the sake of providing the finest patient-oriented dental treatment with world class quality and service. Concurrently, insuring continuous broadening of knowledge and skills of all involved healthcare providers, while participating in patient and public education.
</div>
</div>-->
</div>
</div>
<?php } ?>
<!-- <h4>Introduction</h4>
<p><i>Image Dental Center</i> is where dental need meets pleasure and luxury for the first time. Quality is simply our standard and is not an option. At your visit to our center, we guarantee the commitment of our entire staff to make it the most comfortable and pampered dental visit that you have ever made. From a simple education on your options for dentistry and oral care to a portrayal of full choices of cosmetic dentistry, all you will be offered to attain the smile of your dream.
Our team of outstanding doctors with the superb qualifications in all branches of dentistry will surely answer and deal with all your dental concerns.
</p>
<div class="dt-sc-hr-invisible-small"></div>
<p><h4>Mission</h4> To utilize the latest medical and dental advancements for the sake of providing the finest patient-oriented dental treatment with world class quality and service. Concurrently, insuring continuous broadening of knowledge and skills of all involved healthcare providers, while participating in patient and public education.</p>-->
</div>
<script type="text/javascript">
$(document).ready(function() {
//Horizontal Tab
$('#parentHorizontalTab').easyResponsiveTabs({
type: 'default', //Types: default, vertical, accordion
width: 'auto', //auto or any width like 600px
fit: true, // 100% fit in a container
tabidentify: 'hor_1', // The tab groups identifier
activate: function(event) { // Callback function if tab is switched
var $tab = $(this);
var $info = $('#nested-tabInfo');
var $name = $('span', $info);
$name.text($tab.text());
$info.show();
}
});
// Child Tab
$('#ChildVerticalTab_1').easyResponsiveTabs({
type: 'vertical',
width: 'auto',
fit: true,
tabidentify: 'ver_1', // The tab groups identifier
activetab_bg: '#fff', // background color for active tabs in this group
inactive_bg: '#F5F5F5', // background color for inactive tabs in this group
active_border_color: '#c1c1c1', // border color for active tabs heads in this group
active_content_border_color: '#5AB1D0' // border color for active tabs contect in this group so that it matches the tab head border
});
//Vertical Tab
$('#parentVerticalTab').easyResponsiveTabs({
type: 'vertical', //Types: default, vertical, accordion
width: 'auto', //auto or any width like 600px
fit: true, // 100% fit in a container
closed: 'accordion', // Start closed if in accordion view
tabidentify: 'hor_1', // The tab groups identifier
activate: function(event) { // Callback function if tab is switched
var $tab = $(this);
var $info = $('#nested-tabInfo2');
var $name = $('span', $info);
$name.text($tab.text());
$info.show();
}
});
});
</script>
试试这样的事情
<?php
include("config.php");
$res = mysql_query("select sd.*,s.title from section_description as sd INNER JOIN sections as s ON s.s_id=sd.s_id");
$res1 = mysql_query("select sd.*,s.title from section_description as sd INNER JOIN sections as s ON s.s_id=sd.s_id");
?>
<div id="tabs">
<ul>
<?php while($row = mysql_fetch_assoc($res)) {?>
<li><a href="#<?php echo $row['id']; ?>"><?php echo $row['title'] ?></a></li>
<?php } ?>
</ul>
<?php while($row = mysql_fetch_assoc($res1)) { ?>
<div id="<?php echo $row['id']; ?>">
<p><?php echo $row['description']; ?></p>
</div>
<?php } ?>
</div>
使用你的js和html，它只是演示。