2009-11-04 28 views
0

我在我的页面上有这些标签在PHP中Tabbing?

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事件,以便他们可以在函数中使用?

+1

你尝试过什么?没有大量的额外信息,为你提供代码几乎是不可能的。 – 2009-11-04 04:31:31

+0

从查看您的问题和您的后续评论,我得到的印象是您对PHP和JavaScript如何交互(即他们没有)的常见误解。一旦显示页面,PHP就完成了所有的工作。改变PHP显示内容的唯一方法是向服务器发出一个新的HTTP请求(即请求一个URL)。 Javascript(使用AJAX)允许你隐藏这个请求,并用新信息更新页面,但是我个人会使用下面给出的CSS/javascript选项之一,并简单地显示/隐藏PHP生成的每一位。 – MalphasWats 2009-11-04 15:38:47

回答

4

您可以使用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。

+0

我看过一些在PHP写作时犯下的令人发指的罪行javascript正在写html。它真的会让事情变得过于复杂,并最终导致HTML文档中的内容全部出现。 – MalphasWats 2009-11-04 15:40:58

+0

我完全同意你@MalphasWats,它就像另一个维度的意大利面代码。我提供它作为一个可行的解决方案,可能正是@developer正在寻找的。 我也在寻找另一种方法将服务器端计算值放入JavaScript中,无需异步请求调用。 – 2009-11-04 22:08:21

1

你必须使用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> 
+1

你并不需要ajax。您可以在加载页面时加载所有内容,然后让标签适当地显示/隐藏内容。在这种情况下不需要Ajax。 – Galen 2009-11-04 04:47:17

+0

你是对的,但在这种情况下,页面可能是太重了。 – 2009-11-04 04:55:11

+0

AJAX不会让被显示在它的源我的数据在我的需要是显示其源数据:-( – developer 2009-11-04 08:00:37

0

显示行为将是一个客户端的东西,因为它是东西(一些逻辑),其发生在浏览器上。如前所述,你将不得不使用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选项卡的例子,你可以看看这个。

+0

看,我知道这是可以使用JavaScript来实现,但有要显示的数据是在PHP变量。现在如何将PHP变量赋值给JavaScript ???? – developer 2009-11-04 04:55:06

+0

@developer:我已经更新了我的答案回答你的问题编辑本 – Aishwar 2009-11-04 16:56:18

2

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

一个简单的例子...

<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被复制并粘贴,我很快就打字出来作为一个例子

+0

我都知道,但我已经编辑我的问题,请看到 – developer 2009-11-04 05:01:02

+0

我没有看到任何改变我的答案。 =) – Galen 2009-11-04 05:21:40

+0

就个人而言,我觉得这是做的,只要你只得到了少量的每个选项卡中信息的最佳方式。一旦你开始页面和东西,在每个选项卡正在进行的页面,你页面加载时间都疯了,你就好得多使用基于AJAX方法就去拿你真正需要每次都显示位。 – MalphasWats 2009-11-04 15:42:35