js 多个按钮控制多个DIV的隐藏和显示

JavaScript020

js 多个按钮控制多个DIV的隐藏和显示,第1张

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html charset=gb2312">

<title>RunJS</title>

<script type="text/javascript" src="/jquery-1.10.2.min.js"></script>

<script>

var n=3

onload=function(){

var boxs=document.querySelectorAll(".box")

for(var k=0k<boxs.lengthk++){

var box=boxs[k]

var ps=box.querySelectorAll("p")

var btn=box.querySelector("button")

if(ps.length<n){

btn.style.display="none"

continue 

}

for(var i=ni<ps.lengthi++){

ps[i].style.display="none"

}

btn.onclick=function(){

for(var i=ni<ps.lengthi++){

ps[i].style.display="block"

}

this.style.display="none"

}

}

}

</script>

</head>

<body>

<div class="box">

<p>我是内容1</p>

<p>我是内容2</p>

<p>我是内容3</p>

<p>我是内容4</p>

<p>我是内容5</p>

<p>我是内容6</p>

<button>点击显示全部</button>

</div>

<div class="box">

<p>我是内容1</p>

<p>我是内容2</p>

<p>我是内容3</p>

<p>我是内容4</p>

<p>我是内容5</p>

<p>我是内容6</p>

<button>点击显示全部</button>

</div>

<div class="box">

<p>我是内容1</p>

<p>我是内容2</p>

<p>我是内容3</p>

<p>我是内容4</p>

<p>我是内容5</p>

<p>我是内容6</p>

<button>点击显示全部</button>

</div>

</body>

</html>

用js提交表单解决一个页面有多个提交按钮的问题,主要是判断是否为提交文本,然后再执行相应的动作,比较简单。

function

check(txt){

$j("form").submit(function(){

if($txt=="提交"){

this.action="doAddMessage.action?button=提交"

this.submit()

}else{

this.action="doAddMessage.action?button=保存"

this.submit()

}

})

}

例如:页面中有两个图片按钮的提交,我们这个时候可以给他们都绑定onclick事件,这个时候我们借助jquery的form表单有个事件,叫做submit的。

如图,由于,我的项目里面用了dwr,我把jquery的控制权转让给dwr,jquery重新指定

了一个$j,我们获取表单,然后使用submit事件,通过判断value的值,从而可以进行多个页面的跳转。