做小组内使用的一个简单工具,其中要实现的一个小功能是当某个下拉菜单的选择值改变时触发另一表单元素的属性变化。自然的想到使用select表单元素的onchange事件。

下拉菜单部分的代码如下:

  1. <select name="type" id="type" disabled="disabled" onchange="setDelType(this)">
  2. <option value="1">1-分区表</option>
  3. <option value="2" selected="selected">2-普通表</option>
  4. </select>

下拉菜单的值通过JS更改:

  1. ...
  2. tableType = getTableType(DNS, port, DBName, tableName);
  3. if(tableType == 1){
  4. $("#type").val("1");
  5. }else if (tableType == 2){
  6. $("#type").val("2");
  7. }
  8. ...

结果发现下拉菜单的值发生变化时setDelType(this)并未被调用。原来,通过JS来改变select的值时不会触发其onchange事件的。只有通过鼠标或键盘操作,而且选择的值不同于原始值时才会触发该事件。若需通过JS改变select的值并触发onchange事件需要在代码中显式的触发一下。

修改后的代码如下:

  1. ...
  2. tableType = getTableType(DNS, port, DBName, tableName);
  3. if(tableType == 1){
  4. $("#type").val("1");
  5. $("#type").change();
  6. }else if (tableType == 2){
  7. $("#type").val("2");
  8. $("#type").change();
  9. }
  10. ...

或者:

    1. ...
    2. tableType = getTableType(DNS, port, DBName, tableName);
    3. if(tableType == 1){
    4. $("#type").val("1").change();
    5. }else if (tableType == 2){
    6. $("#type").val("2").change();
    7. }
    8. ...

html select change事件触发的更多相关文章

  1. select change事件给其它元素赋值,本select的value或tex

    select change事件给其它元素赋值,本select的value或textonchange='$("#areaname").val($("option:selec ...

  2. file控件change事件触发问题

    最近,项目中需要用到一个图片上传的功能,我用的file控件来选取图片文件,然后利用js读取文件来预览图片,最后再根据用户的操作来决定是否上传文件. 其中碰到了一个奇怪的问题:在选取完第一张图片,并上传 ...

  3. angular2 select change 事件

    刚开始这是啥?(wrong!!!    change事件会在 选择option行为  之前执行prodDirId,是取不到选择后正确的id值的,取得是选择行为前prodDirId的值(有试过setTi ...

  4. 手动 jq 触发 动态的 layui select change 事件

    var s= $('#province').val(); //先获取   默认选中的第一个 option 的值 ( value)    var select = 'dd[lay-value=' + s ...

  5. select控件自动触发change事件

    这里接上面的二级联动.背景:当页面跳转到修改页面时,需要首先绑定学院和专业.这就需要在页面加载时触发select的change事件,具体用trigger函数进行实现.代码如下. $("#xs ...

  6. jquery 怎么触发select的change事件

    可以使用jQuery的trigger() 方法来响应事件 定义和用法 trigger() 方法触发被选元素的指定事件类型. 语法 $(selector).trigger(event,[param1,p ...

  7. 关于element-ui select组件change事件只要数据变化就会触发的解决办法

    使用select组件和表格组件结合起来用,但是发现在点击下一页的时候,由于select当中的数据发生了变化,所以也会触发select当中的change事件,但是我只希望在我主动改变select组件当中 ...

  8. jQuery 设置select,radio的值,无法自动触发绑定的change事件

    一.问题 今天在对select和radio做change事件绑定后,手动设置其value值,但是不能触发change事件 二.解决 使用trigger方法手动触发

  9. 通过jquery触发select自身的change事件

    ###通过jquery触发select自身的change事件 1.通过js来去触发select的change事件 代码如下:包含了html部分和js部分 //html部分 <select cla ...

随机推荐

  1. struct tm 和 time_t 时间和日期的使用方法(转

    关键字:UTC(世界标准时间),Calendar Time(日历时间),epoch(时间点),clock tick(时钟计时单元) .概念 在C/C++中,对字符串的操作有很多值得注意的问题,同样,C ...

  2. 「51Nod1639」绑鞋带(概率

    1639 绑鞋带  基准时间限制:1 秒 空间限制:131072 KB 分值: 20 难度:3级算法题  收藏  关注 有n根鞋带混在一起,现在重复n次以下操作:随机抽出两个鞋带头,把它们绑在一起.可 ...

  3. javascript 中的深复制 和 其实现方法

    首先,我们需要明白什么是深复制(侧重指对象方面)? 在javascript中,复制分为浅复制和深复制,个人理解,浅复制就是直接将引用复制,复制前后的两个对象指向同一个内存地址,对其中一个进行操作,另外 ...

  4. hbase&nbsp;multiple&nbsp;SLF4J&amp;n…

    hbase multiple SLF4J bindings 警告 hbase shell 和命令操作中经常有个烦人的警告,说SLF4J有多个绑定: hbase(main):003:0> list ...

  5. Will&nbsp;you&nbsp;still&nbsp;need&nbsp;me?

    ON FRIDAY, the National Bureau of Statistics announced that China's working-age population shrank la ...

  6. [转]C/C++获取当前系统时间

    原文转自:http://www.cnblogs.com/mfryf/archive/2012/02/13/2349360.html 个人觉得第二种还是比较实用的,而且也是最常用的~ 不过当计算算法耗时 ...

  7. http verbs--Method Definitions

    http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html part of Hypertext Transfer Protocol -- HTTP/1. ...

  8. Open-source Tutorial - Json.NET

    JSON 简介 JSON(JavaScript Object Notation,JavaScript对象表示法)是一种由道格拉斯·克罗克福特构想和设计.轻量级的数据交换语言,该语言以易于让人阅读的文字 ...

  9. 洛谷 P2216 [HAOI2007]理想的正方形

    P2216 [HAOI2007]理想的正方形 题目描述 有一个a*b的整数组成的矩阵,现请你从中找出一个n*n的正方形区域,使得该区域所有数中的最大值和最小值的差最小. 输入输出格式 输入格式: 第一 ...

  10. IT兄弟连 Java语法教程 Java语言背景

    驱使计算机语言革新的因素有两个:程序设计技术的改进和计算环境的改变.Java也不例外.在大量继承C和C++的基础之上,Java还增加了反应当前程序设计技术状态的功能与精华.针对在线环境的蓬勃发展(In ...