当前位置: 代码迷 >> JavaScript >> 2009-12-24传智播客――JavaScriptDOM增强 (二)(转载)
  详细解决方案

2009-12-24传智播客――JavaScriptDOM增强 (二)(转载)

热度:725   发布时间:2012-11-05 09:35:12.0
2009-12-24传智播客――JavaScriptDOM加强 (二)(转载)

window.onload = function(){

??? //为按钮添加事件处理代码,FORM中的button就是为javascript而生!

??? // 全选

??? var checkedAll = document.getElementById("CheckedAll");

??? checkedAll.onclick = function(){

?????? funcheckedAll();

??? }

??? // 全不选

??? var checkedNo = document.getElementById("CheckedNo");

??? checkedNo.onclick = function(){

?????? funcheckedNo();

??? }

??? // 反选

??? var checkedRev = document.getElementById("CheckedRev");

??? checkedRev.onclick = function(){

?????? // 获取所有选择项

?????? var items = document.getElementsByName("items");

?????? for(var i=0; i<items.length;i++){

?????????? // 判断是否为选中状态,然后设置为反向状态

?????????? if(items[i].checked == true){

????????????? items[i].checked = null;

?????????? } else {

????????????? items[i].checked = "checked";

?????????? }

?????????????

?????? }

??? }

??? // 提交,显示所有被选中的项目

??? var checkedSubmit = document.getElementById("send");

??? checkedSubmit.onclick = function(){

?????? // 获取所有选择项

?????? var items = document.getElementsByName("items");

?????? var itemssend = "";

?????? for(var i=0; i<items.length;i++){

?????????? // 判断是否为选中状态,然后设置为反向状态

?????????? if(items[i].checked == true){

????????????? itemssend += items[i].value +"\r\n";????????????

?????????? }????????????

?????? }

?????? // 如果有被选中的项目,则提示

?????? if(itemssend != "")

?????????? alert(itemssend);

??? }??

??? // 全选/全不选 checkbox

??? var checkedAll_2 = document.getElementById("checkedAll_2");

??? checkedAll_2.onclick = function(){

?????? // 设置标签

?????? if(checkedAll_2.checked == true){

?????????? funcheckedAll();

?????? } else {

?????????? funcheckedNo();

?????? }

??? }

??? //设置每一项的onclick事件,它们将影响全选/全不选的状态。

??? var items = document.getElementsByName("items");

??? for(var i=0;i<items.length;i++){

?????? items[i].onclick = function(){

?????????? // 取出所有项,判断他们的选中状态。

?????????? var items = document.getElementsByName("items");

?????????? var checkedAll = true;

?????????? for(var i=0;i<items.length;i++){

????????????? if(items[i].checked == false){

????????????????? checkedAll = false;

????????????????? break;

????????????? }

?????????? }

?????????? // 如果全部选中,则设置全选/全不选为选中状态

?????????? var checkedAll_2 = document.getElementById("checkedAll_2");

?????????? if(checkedAll == true){

????????????? checkedAll_2.checked = "checked";

?????????? }else{

????????????? checkedAll_2.checked = null;

?????????? }

?????? }

??? }

}

?

?

???????? Merry Christmas,晚安!

  相关解决方案