在PHP中Tabbing？

Question

我在我的页面上有这些标签

Equ |税收|平衡|债务|基金| ETF |镀金.......

然后还有这些选项卡下方的空间。当用户点击这些标签则对应于这些标签数据必须被显示在空间不改变，当我点击恶趣那么它的数据将显示在该空间中，如果我点击税那么它的数据page.Like的网址将显示在同一个空间中，就像它覆盖了以前的数据一样。必须显示的数据是使用php计算的。 那么什么是这样做的使用PHP或JavaScript最简单的方法???

一些编码帮助将这里赞赏。

编辑： 看，我知道这是可以使用JavaScript来实现，但有要显示的数据是在PHP变量。现在如何分配PHP变量的JavaScript ????

<script type="text/javascript"> 
function showhide(ref) 
{ 
    document.getElementById('mf').innerHTML= HERE I WANT A PHP VARIABLE; 
} 
</script> 

如何发送我的pfp变量在onclick事件，以便他们可以在函数中使用？

Answer 1

您可以使用CSS和/或Javascript来帮你做的伎俩。使用JavaScript标签

http://edeverett.co.uk/experiments/css_only_tabs.html

例：只使用CSS标签

例

http://jqueryui.com/demos/tabs/

编辑 作为回复您的编辑：

编辑：看，我知道这是可以使用JavaScript来实现，但有要显示的数据是在PHP变量。现在如何分配PHP变量的JavaScript ????

同步进行服务器端的一切，你可以注入的运算结果到您的javascript：

function showhide(ref) 
{ 
    document.getElementById('mf').innerHTML= '<?php echo $variable; ?>'; 
} 

一个更好的做法是使用AJAX。

Answer 2

你必须使用ajax

你可以使用一些库，例如xajax的，mootools的jquery的或。

UPD： 实施例与mootools的： 第一个创建单独的PHP文件，返回文本acording到标签（createContent中。PHP） 然后在javascript：

function menuClick(var i) 
{ 
    var request1 = new Request.HTML({ url: 'createContent.php?i='+i, 
     onSuccess: function(html) { 
      $('div1').set('text', ''); 
      $('div1').adopt(html); 
      $('div1').innerHTML = ''; 
     }, 
     onFailure: function() { 
      $('div1').set('text', ''); 
      $('div1').innerHTML = ''; 
     } 
    }); 

    request1.send(); 
    return false; 
} 

在HTML中的onclick添加用该函数标签：

<a href="#" onclick="return menuClick(1);">EQU</a> 

Answer 3

显示行为将是一个客户端的东西，因为它是东西（一些逻辑），其发生在浏览器上。如前所述，你将不得不使用javascript/css来做到这一点。

在编码的帮助方面，你可能会有所帮助： http://stilbuero.de/jquery/tabs_3/

编辑

所以，如果你想要把一个PHP变量存在，这是你做什么，使这个“.php”页面：

<script type="text/javascript"> 
function showhide(ref) 
{ 
    document.getElementById('mf').innerHTML= <?php echo $VAR ?>; 
} 
</script> 

当然，这里假设你已经在渲染页面之前计算了变量。如果变量的值取决于页面上的某些动作（例如，在文本框中输入一些文本并点击按钮 - 就像搜索框一样），那么您必须为此使用AJAX。你可以通过向php页面发送POST请求的GET请求来实现，然后显示该页面的内容。我上面发布的链接有一个AJAX选项卡的例子，你可以看看这个。

Answer 4

这其实很简单。您不需要在标签点击上动态加载数据。您可以在加载页面时一次加载数据，然后根据需要显示/隐藏。

一个简单的例子...

<ul id="#nav"> 
<li><a href="#" id="equ-tab">equ</a></li> 
<li><a href="#" id="tax-tab">tax</a></li> 
<li><a href="#" id="bal-tab">balanced</a></li> 
</ul> 

<div id="content"> 
    <div id="content-equ">equ content</div> 
    <div id="content-tax">tax content</div> 
    <div id="content-bal">balanced content</div> 
</div> 

假设EQU是默认的内容。当页面加载隐藏除EQU以外的所有其他div（使用CSS或优选JavaScript）

使用javascript（jQuery推荐）当单击标签时隐藏所有内容，然后显示标签内容。

$('#nav a').click(function(){ // when a nav link is clicked 
    $('#content div').hide(); // hide all content 
    $('#content #content-'+$(this).attr('id')).show(); // show content that has id #content-<tabID> 
}); 

代码并不意味着OT被复制并粘贴，我很快就打字出来作为一个例子