遍历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. JSP中调用Spring的方法

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  2. js中数据操作的某些思想

    1,默认数据的复用 写成function的return形式缓存在变量中,用的时候直接执行fun就行了 例如 有文件text.js里面的对象是export default ()=>({aa:55, ...

  3. vue X-Template

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 安装配置oh-my-zsh

    1.下载安装iterm:https://www.iterm2.com/ 2.安装zsh 查看系统当前使用的shell $ echo $SHELL /bin/bash 查看系统是否安装了zsh $ ca ...

  5. python 数据的存储

    数据的存储 思考:为什么使用计算机?存储数据,计算数据 思考:数据存在哪里?数据存储在内存里 思考:数据怎么在内存里存储的?首先弄明白怎么存储数字 1010.5“sunck is a good man ...

  6. Delphi 类（TObject、TPersistent、TComponent、TControl、TWinControl、TCustomControl、TGraphicControl、TInterfacedObject）简单介绍

      TObject:    VCL中所有类的根类,即是说:VCL中所有的类/组件/控件都是从TObject中继承而来.TObject类中定义了基本的 构造方法和析构方法.   TPersistent: ...

  7. 根据ID查询实体

    //查询实体 $scope.findOne=function(id){ $http.get('../brand/findOne.do?id='+id).success( function(respon ...

  8. Python 项目隔离环境virtualenv--venv

    virtualenv 用来为一个应用创建一套“隔离”的python运行环境. 先安装virtualenv: pip3 install virtualenv 再进入项目目录,或者创建一个项目目录并进入, ...

  9. 最长上升子序列（LIS）问题

    最长上升子序列(LIS)问题 此处我们只讨论严格单调递增的子序列求法. 前面O(n2)的算法我们省略掉,直接进入O(nlgn)算法. 方法一:dp + 树状数组 定义dp[i]:末尾数字是i时最长上升 ...

  10. C++ STL(一)介绍及string

    STL: C++标准模板库的简称,它是C++的一部份.标准C++库的所有的标识符都是在一个名为std的命名空间中定义的 在使用STL中相关模板时,需要包含相关头文件,然后using namespace ...