<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>事件类型（onchange）</title>

    <!--

        n.onchange=代码a;元素n的值发生变化时执行代码a；

        扩展知识：

        a.options: 可返回a元素中所有 <option> 的一个数组。

        a.selectIndex: 可设置或返回下拉列表a中被选选项的索引号

     -->

    <script>

        window.onload=function (){  //页面加载完成后执行函数

            var a=document.getElementById("sel");   //获取下拉列表

            a.onchange=function (){     //下拉列表发生变化时执行函数

                //var val=this.value;   //可以用此方法获取下拉列表中每个选项的value

                var val=a.options[a.selectedIndex].value;//也可以用此方法获取下拉列表中每个选项的value

                document.body.style.background=val;//给body设置背景颜色，颜色值为下拉框选项的value

            }

        }

    </script>

</head>

<body>

    <span>请选择页面颜色：</span>

    <select id="sel">

        <option value="white" selected>请选择</option>

        <option value="red">红色</option>

        <option value="green">绿色</option>

        <option value="blue">蓝色</option>

    </select>

</body>

</html>

事件类型（onchange）的更多相关文章

  1. javascript常见的几种事件类型

    第一种事件类型:onchange() <body> <select id="sheng" onchange="fn1();"> < ...

  2. javascript 的 事件类型（事件）

    事件通常与函数配合使用,这样就可以通过发生的事件来驱动函数执行. 事件是文档或者浏览器窗口中发生的,特定的交互瞬间. 事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都 ...

  3. MySQL binlog中的事件类型

    MySQL binlog记录的所有操作实际上都有对应的事件类型的,譬如STATEMENT格式中的DML操作对应的是QUERY_EVENT类型,ROW格式下的DML操作对应的是ROWS_EVENT类型. ...

  4. 深入理解DOM事件类型系列第二篇——键盘事件

    × 目录 [1]类型 [2]顺序 [3]按键信息[4]应用 前面的话 鼠标和键盘是电脑端主要的输入设备,上篇介绍了鼠标事件,本文将详细介绍键盘事件 类型 键盘事件用来描述键盘行为,主要有keydown ...

  5. DOM事件类型详解

    一.表单事件: input事件当<input>.<textarea>的值发生变化时触发.此外,打开contenteditable属性的元素,只要值发生变化,也会触发input事 ...

  6. JS中的事件类型和事件属性的基础知识

    周末无聊, 这几天又复习了下JS搞基程序设计3, 想着好记性不如浪笔头哇, 要么把这些东西写下来, 这样基础才能更加扎实么么哒, 知道的同学也可以直接过一下,当做复习,  小姨子再也不用担心我的学习啦 ...

  7. JavaScript事件类型

    JavaScript事件类型 Web浏览器中可能发生的事件有很多类型.这里我将主要将下面几种常用的事件类型: UI事件 焦点事件 鼠标与滚轮事件 键盘与文本事件 复合事件 变动事件 HTML5事件 设 ...

  8. javascript事件类型之界面拖拽交互

    一.在线DEMO 界面拖拽交互

  9. 在 SharePoint Server 2013 中配置建议和使用率事件类型

    http://technet.microsoft.com/zh-cn/library/jj715889.aspx 适用于: SharePoint Server 2013 利用使用事件,您可以跟踪用户与 ...

随机推荐

  1. php开发工程师都需要掌握什么技能呢？

    PHP原生标准库精通,三种大型框架中熟练掌握一门的开发(Symfony2.Yii.ZF2),小型框架中(Codeigniter 等)通读其一源码. MySQL语句精通,实践构造 1000 万级的数据库 ...

  2. 对一次 redis 未授权写入攻击的分析以及学习

    前段时间自己使用 redis 开发的时候,搞了一个 docker ,然后直接开放连接没有密码,其实一开始我就知道会被黑产扫到然后给我种马,但是把因为也是测试服务,其实也没怎么上心,于是就放任自由了,结 ...

  3. Linux RedHat7.0_64位系统中安装Oracle_11g_R2

    步骤一: 当然是安装rhel7操作系统啦(废话),建议在安装过程中系统软件类型选择最后一项[Server with GUI].其他的默认一般即可. 步骤二:在初装完成的系统中无法像Windows那样直 ...

  4. .net Dapper 实践系列(4) ---数据查询(Layui+Ajax+Dapper+MySQL)

    写在前面 上一小节,总结了数据显示时,会出现的日期问题.以及如何处理格式化日期.这个小节,主要总结的是使用Dapper 中的QueryMultiple方法依次显示查询多表的数据. 实践步骤 1.在Bo ...

  5. C# vb .net图像合成-合成星形

    在.net中,如何简单快捷地实现图像合成呢,比如合成文字,合成艺术字,多张图片叠加合成等等?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码 ...

  6. OpenFace 调试记录

    1.OpenFace 是 卡耐基梅陇(CMU)大学的一个图像+机器学习项目,整体程序包含:人脸发现,特征提取,特征神经网络训练,人脸识别这四部分. github   https://github.co ...

  7. 独热编码（One-Hot）的理解

    https://www.imooc.com/article/35900 参考上面大神的原文,说的非常透彻.非常便于理解.感谢 感谢 自己做个小笔记,便于自己学习 特征值是离散的,无序的. 如: 性别特 ...

  8. Java知识回顾 （17）MySQL链接

    本部分介绍如何使用JDBC 连接 MySQL 数据库. 驱动包下载 Java 连接 MySQL 需要驱动包,最新版下载地址为:http://dev.mysql.com/downloads/connec ...

  9. python3基础之“术语表（2）”

    51.编程: 让计算机执行的指令. 52.代码: 让计算机执行的命令. 53.底层编程语言: 与高级语言相比,更接近二进制的语言. 54.高级编程语言: 读起来像英语的易于理解的语言. 55.汇编语言 ...

  10. react学习记录（一）

    一.React是什么 声明式写法(强调结果,命令式编程强调过程) 组件化 一次学习,随处编写(多种应用场景,web程序,原生手机应用,系统应用,命令行工具) 二.为什么学习react 大公司加持-fa ...