div点击按钮刷新页面
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了div点击按钮刷新页面相关的知识，希望对你有一定的参考价值。
点击上面的按钮，只改变下面的内容。
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
*
margin:0;
padding:0;
body
font:normal 1em Arial, Helvetica, sans-serif;
margin:0;
padding:0;
a text-decoration:none; color:black;
a:hover text-decoration:underline; color:red;
.demo
width:300px;
height:300px;
border:solid 1px #ccc;
margin:50px;
.tabs
list-style:none;
.tabs li
border:solid 1px #936;
border-radius:5px;
width:80px;
height:24px;
line-height:24px;
background:#ccc;
text-align:center;
float:left;
margin:10px;
cursor:pointer;
.cont
width:300px;
height:250px;
background:#96F;
display:none;
.cont01 background:#00F;
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function()
$(".cont").eq(0).show();
$(".tabs li").click(function()
var $index = $(".tabs li").index(this); //获取当前点击的号数
$(".cont").hide(); //先将两个内容隐藏
$(".cont").eq($index).show(); //选中的当前号数的内容块显示
);
);
</script>
</head>
<body>
<div class="demo">
<ul class="tabs">
<li>环境问卷</li>
<li>土地问卷</li>
</ul>
<div class="cont cont01">
</div>
<div class="cont cont02">
</div>
</div>
</body>
</html>
我这个只是简单的实现点击内容块切换功能具体的你还是得结合你的结构写好css美化下，还有如果想要更美观更多关于这种功能的特效，你也可以直接百度，jquery tabs，，不过建议能自己写就自己写啦，当学习呗。。。。具体我的演示如下
初始化
点击后
$.ajax(
url: "test.html",
cache: false,
success: function(html)
$("#divId").append(html);
);
html 如何刷新后退按钮点击页面？
以上是关于div点击按钮刷新页面的主要内容，如果未能解决你的问题，请参考以下文章