使用php在jquery选项卡中显示内容 [英] Using php to display content in jquery tabs

问题描述

我有一个带有几个jquery标签的页面，每个标签都想显示一个php函数的结果，如下所示:

I have a page with a few jquery tabs, each of which I want to display the result of a php function, as follows:

<ul  id="tabs" class="ccm-dialog-tabs">
    <li class="ccm-nav-active"><a href="javascript:void(0);" id="tabs-1">Tab 1 Title  </a></li>
    <li><a href="javascript:void(0);" id="tabs-2">Tab 2 Title></a></li>                  
</ul>

<div id="tabs-1-tab">
    <?php  echo "This is tab 1<br>"; ?>
</div>

<div id="tabs-2-tab">
    <?php  echo "This is tab 2<br>"; ?>
</div>

使选项卡起作用的jquery是:

The jquery to make the tabs work is:

<script type="text/javascript" language="javascript">
    var ccm_activeTransactionsTab = "tabs-1";
    $("#transaction_tabs a").click(function() {
        $("li.ccm-nav-active").removeClass('ccm-nav-active');
        $("#" + ccm_activeTransactionsTab + "-tab").hide();
        ccm_activeTransactionsTab = $(this).attr('id');
        $(this).parent().addClass("ccm-nav-active");
        $("#" + ccm_activeTransactionsTab + "-tab").show();
  });
</script>

我遇到的问题是，当页面加载时，活动选项卡显示两个php语句的结果-即它显示:

The problem I am having is that when the page loads, the active tab shows the result of both php statements - i.e. it shows:

echo "This is tab 1<br>;
echo "This is tab 2<br>;

如果我在选项卡之间单击几次，则多余的信息就会消失.这些选项卡可以正常工作，仅当它们显示php函数的输出时才会出现问题.

If I click between the tabs a few times then the extra information disappears. These tabs work fine normally, the problem only arises when they show the output of a php function.

推荐答案

我建议您先使用hide然后在开始时使用简单的CSS

I would suggest you use hide then at start using simple CSS

<div id="tabs-1-tab" style='display:none'>
    <?php  echo "This is tab 1<br>"; ?>
</div>

<div id="tabs-2-tab"  style='display:none'>
    <?php  echo "This is tab 2<br>";?>
</div>

您还错过了语句<?php echo "This is tab 1<br>; ?>

这篇关于使用php在jquery选项卡中显示内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！