遍历checkbox

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Insert title here</title>

</head>

<body>

<input type="checkbox" name="sex[]" value='男'/>男

<input type="checkbox" name="sex[]" value='女'/>女

<input type="checkbox" name="sex[]" value='保密'/>保密

<input id="bu1" type="button" value="遍历checkbox"/>

</body>

</html>

<script type="text/javascript">

document.getElementById('bu1').onclick=function(){

    var bL=document.getElementsByName('sex[]');

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

        alert(bL[i].value);

        alert(bL[i].checked);

    }

}

</script>

遍历select

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Insert title here</title>

<script type="text/javascript">

function fun1(){

    var ob=document.getElementsByName('province')[0];

    var oC=ob.options;

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

        alert(oC[i].value);

        alert(oC[i].text);

        alert(oC[i].selected);

    }

}

function addCity(){

    //根据province选中的值，来给city追加option

    var ob=document.getElementsByName('province')[0];

    var v=ob.value;//获取被选中的option的value属性值

    var cityOb=document.getElementsByName('city')[0];

    switch(v){

    case '0':

        cityOb.options.length=1;

        cityOb.options[0].value='0';

        cityOb.options[0].text='请选择';

        break;

    case '1':

        cityOb.options.length=3;

        cityOb.options[0].value='0';

        cityOb.options[0].text='请选择';

        cityOb.options[1].value='1';

        cityOb.options[1].text='海淀区';

        cityOb.options[2].value='2';

        cityOb.options[2].text='丰台区';

        break;

    case '2':

        cityOb.options.length=4;

        cityOb.options[0].value='0';

        cityOb.options[0].text='请选择';

        cityOb.options[1].value='1';

        cityOb.options[1].text='石家庄';

        cityOb.options[2].value='2';

        cityOb.options[2].text='承德';

        cityOb.options[3].value='3';

        cityOb.options[3].text='唐山';

        break;

    case '3':

        cityOb.options.length=2;

        cityOb.options[0].value='0';

        cityOb.options[0].text='请选择';

        cityOb.options[1].value='1';

        cityOb.options[1].text='济南';

        break;

    }

}

</script>

</head>

<body>

<select onchange="addCity();" name="province">

    <option value="0">请选择</option>

    <option value='1'>北京</option>

    <option value='2'>河北</option>

    <option value='3'>山东</option>

</select>

<select name="city">

    <option value="0">请选择</option>

</select>

<input onclick="fun1();" type="button" value="遍历option"/>

</body>

</html>

javascript中的select、checkbox的更多相关文章

  1. javascript中的内置对象

    2015.12.1 javascript中的内置对象 复习: 1.js中的内置函数 alert prompt write parseInt parseFloat eval isNaN document ...

  2. JavaScript中的execCommand()命令详解及实例展示

    execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用如下格式:document.execCommand(sCommand[,交互方式, 动态参数]) ,其 ...

  3. JavaScript中的execCommand

    execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用 如下格式:document.execCommand(sCommand[,交互方式, 动态参数]) , ...

  4. Javascript中的Form表单知识点总结

    Javascript中的Form表单知识点总结 在HTML中,表单是由form元素来表示的,但是在javascript中,表单则由HTMLFormElement类型,此元素继承了HTMLElement ...

  5. JavaScript中常用的事件

    .onclick事件 点击事件(onclick并不是js中的方法,onclick只是浏览器提供js的一个dom接口,让js可以操作dom,所以onclick大小写都是没问题的,比如HTML代码就不用区 ...

  6. 【转载】javascript中的函数对象

    原文地址:http://www.cnblogs.com/phpzxh/archive/2009/09/16/1568137.html[侵删] 在javascript中函数的申明方式有四种 下面代码中一 ...

  7. JavaScript中的表单编程

    表单编程 1获取表单相关信息 1.什么是表单元素 1.什么是表单元素 在H TML中表单就是指form标签,它的作用是将用户输入或选择的数据提交给指定的服务器 2.如何获取表单元素 <form ...

  8. 根据JavaScript中原生的XMLHttpRequest实现jQuery的Ajax

    基本介绍 XmlHttpRequest XmlHttpRequest是JavaScript中原生的,历史悠久的一种发送网络请求的方案. 基本上所有前端框架对于网络请求的部分都是基于它来完成的. 在本章 ...

  9. javascript中函数的3个高级技巧

    × 目录 [1]作用域安全 [2]惰性载入 [3]函数绑定 前面的话 函数对任何一门语言来说都是一个核心的概念,在javascript中更是如此.前面曾以深入理解函数系列的形式介绍了函数的相关内容,本 ...

随机推荐

  1. 启动Process实现多任务

    from multiprocessing import Process import time '''multiprocessing模块1.跨平台的多进程模块2.提供了一个Process类的实例代表一 ...

  2. 配置 Linux 静态网卡 & 远程连接 MySQL 问题

    1.设置 Linux 为静态网络配置 使用 VMWare 安装好 CentOS 后,将网络适配器设置为 NAT 模式.为了防止 IP 关机重启时候经常变动,需要将网卡信息设置为静态. 修改 /etc/ ...

  3. Java中的可变参数和asList方法

    可变参数: List.of

  4. winform中动态生成多行label，同时添加滚动条

    设计思路大概是这样的,Form内添加一个groupBox,groupBox内添加一个panel,panel的属性AutoScroll=true,在panel内动态添加label. 原始From如下: ...

  5. 批量新增数据（BuckCopy）

    批量新增数据(BuckCopy) 使用webService传输数据时要注意,Datatable中的数据类型,以及科学计数 /// <summary> /// 批量新增数据 /// < ...

  6. CSS制作红桃心

    这里主要用到了before与after属性之前之后 代码: <!DOCTYPE html> <html> <head> <meta charset=" ...

  7. 吉首大学校赛 I 滑稽树上滑稽果 （Lucas + 莫队）

    链接:https://ac.nowcoder.com/acm/contest/925/I来源:牛客网 题目描述 n个不同的滑稽果中,每个滑稽果可取可不取,从所有方案数中选取一种,求选取的方案中滑稽果个 ...

  8. fiddler抓包工具详解

    转自:http://www.cnblogs.com/yyhh/p/5140852.html Fiddler 抓包工具总结   阅读目录 1. Fiddler 抓包简介 1). 字段说明 2). Sta ...

  9. scrapy主要防止封IP策略

    scrapy如果抓取太频繁了,就被被封IP,目前有以下主要策略保证不会被封: 策略1:设置download_delay下载延迟,数字设置为5秒,越大越安全 策略2:禁止Cookie,某些网站会通过Co ...

  10. spring boot开发，jar包一个一个来启动太麻烦了，写一个bat文件一键启动

    spring boot开发,jar包一个一个来启动太麻烦了,写一个bat文件一键启动 @echo offcd D:\workProject\bushustart cmd /c "title ...