2013-03-25 101 views
0

我应该创建一个索引页,其中某些部分(如页眉和页脚)已修复,但主要内容是可更改的, 我认为必须将我的内容设置为iframe并更改iframe src与JavaScript,但我没有任何想法如何做到这一点。 我该怎么做?有没有其他解决方案?更改固定页面中的可更改内容

+0

随便找jquery.ajax,它会很容易。 – egig 2013-03-25 10:07:05

+0

我在ajax noob,我怎么能改变**只是**页面的一部分? – user2207044 2013-03-25 10:16:03

+0

显示你的尝试或你有什么 – theshadowmonkey 2013-03-28 01:25:32

回答

0

嗨也许有更好的选择比帧考虑(这是“坏”的做法)是否是适合你的项目,你可以使用基于jQuery的脚本为Pagify

或其他一些你所选择的:JQUERY ONE PAGE SCRIPTS 在这样你将以更现代的方式表现你的内容。 但它总是取决于最终结果必须是什么。所以如果不是答案,请提供一些更多细节。

+0

我认为你需要遵循我的链接复制粘贴工作示例和构建你的页面,你不需要AJAX这种方式,并会一次生成所有的内容,但不显示它。 – 2013-03-25 10:21:11

+0

哇谢谢,我讨厌改变帧也只是丑陋的,我认为我的问题解决了。 – user2207044 2013-03-25 10:22:38

+0

这个脚本一次加载所有页面? – user2207044 2013-03-25 10:28:02

0

你可以用CSS做

<!doctype html> 
<html lang="en"> 
<head> 
<meta charset="utf-8" /> 
<script src="http://code.jquery.com/jquery-1.7.1.js"></script> 
<style type="text/css"> 
body { 
    margin: 0px; 
} 
#wrapper { 
    width: 1000px; 
    margin-top: 0; 
    margin-right: auto; 
    margin-bottom: 0; 
    margin-left: auto; 
} 
#wrapper #header { 
    width: 1000px; 
    height: 80px; 
    background-color: #C90; 
    position: fixed; 
    float: left; 
} 
#wrapper #main { 
    float: left; 
    font-family: Arial, sans-serif; 
    font-size: 12px; 
    color: #333; 
    padding: 5px; 
    width: 990px; 
    margin-top: 80px; 
margin-bottom: 80px; 
} 
#wrapper #footer { 
    background-color: #C60; 
    height: 80px; 
    width: 1000px; 
    position: fixed; 
    bottom: 0px; 
    float: left; 
} 
</style> 
<script> 

</script> 
</head> 
<body> 
    <div id="wrapper"> 
     <div id="header"> 
      Header 
     </div> 
     <div id="main"> 
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien. Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper eu, fringilla at, lacinia ut, augue. Nullam nunc.</p> 
      <p>.....</p> 
     </div> 
     <div id="footer">footer</div> 
    </div> 
</body> 
</html> 

然后你就可以从服务器的数据加载到与使用Ajax