更新页面的特定区域而不重新加载整个页面

时间:2011-09-06 06:27:19

标签: php javascript html css ajax

我认为,如果您可以先查看我的网站,感觉更容易理解:http://www.10winstreak.com/

主要内容区域是来自Own3D.tv的流,它只是一个iframe(第342行)。我的目标是,如果我点击右侧的特定流,iframe将加载相应的流,左侧栏(Last 10 Matches)也会加载相应的数据。例如,如果我单击右侧的“Bei's Stream”,iframe将显示Bei的流,左侧栏显示它现在显示的内容。但是当我点击“Roy Killany's Stream”时,iframe将加载该特定流,左侧栏填充另一组定义的数据。

我想我可以通过为每个流制作单独的页面来实现它,只是复制页面布局,这样用户就会有一种停留在同一页面上的错觉,但我想学习正确的方法。到目前为止,我的研究告诉我,ajax可能是最好的选择,但我想知道是否有纯PHP甚至HTML \ CSS方式吗?

谢谢!

2 个答案:

答案 0 :(得分:1)

通过设置框架的名称并将链接目标指向该框架,您可以使用HTML完成此操作:

<a href="somepage" target="myframe">My Link</a>
<iframe name="myframe" src="defaultpage"></iframe>

但是这不会让你在点击时更改链接以显示其被点击的链接。您还可以使用jQuery,它可以让您更改链接以显示已单击它。有关jQuery的更多信息,请查看他们的主页(www.jquery.com)

答案 1 :(得分:0)

嗯..你可以使用jquery .load()

http://api.jquery.com/load/

以及加载图片的示例.. http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/

我想如果您希望刷新后或用户返回时内容仍然存在。您可能希望将它与jquery cookie插件一起使用,以使浏览器记住加载了哪些内容。