您的位置：首页 > Web前端 > JavaScript

js实现全选和反选功能

2013-12-02 11:51 603 查看

1.页面

复制代码
<html>

<head><title>导出excel</title><head>

<body>

<p style="text-align:center; padding-top:15px">

选择班级：

<select name="claId" id="claId" style="color:#999999">

　　<option value="0" style="color:#999999">==选择==</option>

　　　　<option value=1 style="color:#000000">药学1班</option>

　　　　<option value=2 style="color:#000000">药学2班</option>

</select>

</p>

<p></p>

<p style="text-align:center; padding-top:15px">  选择需要导出的选项：</br>

　　 <input type="checkbox" name="stu" id="a" value="考生学号">考生学号  

　　<input type="checkbox" name="stu" id="a" value="考生姓名">考生姓名</br>

　　<input type="checkbox" name="stu" id="a" value="考生班级">考生班级  

　　<input type="checkbox" name="stu" id="a" value="考生性别">考生性别</br>

　　<input type="checkbox" name="stu" id="a" value="考试得分">考试得分  

　　<input type="checkbox" name="stu" id="a" value="测试时间">测试时间</br>

　　<input type="checkbox" name="stu" id="a" value="交卷时间">交卷时间  

　　<input type="checkbox" name="stu" id="a" value="考试用时">考试用时</br>

</p>

<p style="text-align:center; padding-top:15px">

　　<input type="button" value="全选" onclick="allSelectType();"/>

　　<input type="button" value="反选" onclick="invertSelectType();"/>

</p>

</body>

</html>
复制代码

2.相关的js代码

复制代码
//反选

function invertSelectType()

{

//这里重写反选和全选方法，因为再次使用原先的会导致页面上的选项也会被选

　　var ids=$("input[name='stu']");

　　 for(var i=0;i<ids.length;i++)

　　{

　　　　if(ids[i].checked==true)

　　　　{

　　　　　　ids[i].checked="";

　　　　}else{

　　　　　　ids[i].checked="checked";

　　　}

　　}

}

//全选

function allSelectType()

{

　　var ids=$("input[name='stu']");

　　for(var i=0;i<ids.length;i++)

　　{

　　　　ids[i].checked="checked";

　　}

}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航