遍历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. 【hihoCoder】每周一题（从week 220开始）

    2018/9/17-2018/9/23  week 220 push button I 题目链接:https://hihocoder.com/contest/hiho220/problem/1 有N个 ...

  2. mysql 判断指定条件数据存不存在，不存在则插入

    折腾了半天终于把这个给折腾顺了,但是后来发现用不了竟然...悲剧啊,但是还是要记录下加深记忆 insert into table1 (field1, field2,field3) select ?fi ...

  3. Form与ModelForm中的插件使用

    一.Form插件的使用 (一)widget参数 from .models import * from django import forms from django.forms import widg ...

  4. Delphi 窗体函数GetWindowRect 取窗口矩形坐标

    GetWindowRect,用于取窗口矩形坐标.返回值类型:布尔型(LongBool).执行成功返回真(True),否则返回假(False);参数1类型:整数型(HWND),目标窗口的窗口句柄;参数2 ...

  5. Yii2 搜索

    搜索的形式: 第一种,点击空白处: <?php $data=['0'=>'已删除','10'=>'正常','1'=>'锁定']; ?> <table style=' ...

  6. Shiro学习（9）JSP标签

    Shiro提供了JSTL标签用于在JSP/GSP页面进行权限控制,如根据登录用户显示相应的页面按钮. 导入标签库 Java代码   <%@taglib prefix="shiro&qu ...

  7. Android中自己定义一个shade.xml

    自己定义一个shade: <shape> <!-- 实心 --> <solid android:color="#ff9d77"/> <!- ...

  8. CSS中各种百分比（%）

    1.固定定位  position:absolute;width:100%;height:100%: 中%相对的   都是浏览器的可视窗口宽高. 2.标准文档流中,标签的 % 单位除了height以外, ...

  9. Future初次使用理解

    当客户端执行方法时,立即返回一个代理对象,此时代理对象没有数据,与此同时开启一个线程去构造真实对象并把真实对象替换掉代理对象(使用set方法).所以就会出现,客户端收到代理对象之后以为执行完了然后执行 ...

  10. 14、testng.xml 设置用例执行顺序

    目录如下: TestGroup.java 代码如下: package com.testng.cn; import org.testng.annotations.*; import static org ...