首先你需要在php设计的时候就有这种想法。
创新互联公司专注于略阳网站建设服务及定制，我们拥有丰富的企业做网站经验。 热诚为您提供略阳营销型网站建设，略阳网站制作、略阳网页设计、略阳网站官网定制、微信小程序开发服务，打造略阳网络公司原创品牌,更为您提供略阳网站排名全网营销落地服务。
?php
//这里是模拟你从数据库读出来的数据格式
$student['id'][0]="01";
$student['name'][0]="张三";
$student['sex'][0]="男";
$student['id'][1]='02';
$student['name'][1]="李四";
$student['sex'][1]="男";
$student['id'][2]='03';
$student['name'][2]="黄美美";
$student['sex'][2]="女";
?
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=GB2312" /
titleUntitled Document/title
/head
script type="text/javascript"
function hideSex(type){
var objName;
var objName_;
var obj;
var obj_;
if(type==0){
objName="m";
objName_="f";
}else{
objName="f";
objName_="m";
}
obj=document.getElementsByName(objName);
obj_=document.getElementsByName(objName_);
vari=0;
for(i=0;iobj.length;i++){
obj[i].style.visibility="hidden";
}
for(i=0;iobj_.length;i++){
obj_[i].style.visibility="visible";
}
}
function showAll(){
var obj;
var obj_;
obj=document.getElementsByName("m");
obj_=document.getElementsByName("f");
for(i=0;iobj.length;i++){
obj[i].style.visibility="visible";
}
for(i=0;iobj_.length;i++){
obj_[i].style.visibility="visible";
}
}
/script
style type="text/css"
.div_id{top:0px;left:0px;width:20pxl;height:20px;line-height:20px;border:1px solid rgb(200,200,200);position:absolute}
.div_name{top:0px;left:20px;width:50px;height:20px;line-height:20px;border:1px solid rgb(200,200,200);position:absolute}
.div_sex{top:0px;left:70px;width:20px;height:20px;line-height:20px;border:1px solid rgb(200,200,200);position:absolute}
.bt{width:80px;height:20px;position:absolute}
/style
body
?php
for($i=0;$icount($student['id']);$i++){
$list_top=20*$i;
if($student['sex'][$i]=="男"){
$div_id="m";
}else{
$div_id="f";
}
echo "div name=\"".$div_id."\" style='top:".$list_top."px;left:0px;width:100px;height:20px;line-height:20px;border:0;position:absolute;'
div class='div_id align='center'".$student['id'][$i]."/div
div class='div_name' align='center'".$student['name'][$i]."/div
div class='div_sex' align='center'".$student['sex'][$i]."/div
/div";
}
echo("input type='submit' value='隐藏男生' onclick=\"hideSex(0);\" style='top:".($list_top+30)."px;left:0px;' class='bt'/");
echo("input type='submit' value='隐藏女生' onclick=\"hideSex(1);\" style='top:".($list_top+30)."px;left:90px;' class='bt'/");
echo("input type='submit' value='显示全部' onclick='showAll();' style='top:".($list_top+30)."px;left:180px;' class='bt'/");
?
/body
/html
这只是简单演示一下，至于什么重新排版什么的，你自己斟酌好了。
其实也不算可靠，同样可以伪造，一般hidden是加token避免一些非法提交的。
你后端处理post数据首先得判断是否是post请求才能下一步操作，如果直接获取post内容，会出现一些警告。
一般说来，在数据提交的页面不能使用返回和刷新等功能，应该在页面上进行醒目标记，教育用户。
要想 的网页与众不同－－刷新不会重新提交，那么 可以在页面上弄一个隐藏的iframe，form提交的目标指向这个iframe，而由iframe调用js代码在主页面描述提交结果，这样的页面刷新的时候就等于新进入。
大致的结果如下：
div id=result_div/div
form method=post target=post_frm...../form
iframe name=post_frm style='display:none'/iframe?phpif (isset($_post['submi11t'])==true){$result='';
if (提交数据检查不通过) $result.='提交数据不合格！';
else if (数据保存成功) $result.='数据保存成功。';
else $result.='数据保存失败！';
加个判断就好了。。。成交状态是未联系 就黑色。。 反之就显示
如果要用户体验度好一点 就ajax 设置样式。。