做小组内使用的一个简单工具,其中要实现的一个小功能是当某个下拉菜单的选择值改变时触发另一表单元素的属性变化。自然的想到使用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. hadoop集群的安装

    Hadoop集群安装 1.配置JDK环境和设置主机名,本地解析 JDK环境教程: http://www.cnblogs.com/wangweiwen/p/6104189.html 本地解析: vim ...

  2. OpenCV——Skewing

    // define head function #ifndef PS_ALGORITHM_H_INCLUDED #define PS_ALGORITHM_H_INCLUDED #include < ...

  3. Python基础入门知识

    本节内容 Python介绍 发展史 Python 2 or 3? 安装 Hello World程序 变量 用户输入 模块初识 .pyc是个什么鬼? 数据类型初识 数据运算 表达式if ...else语 ...

  4. BZOJ2028:[SHOI2009]会场预约(平衡树版)

    浅谈\(splay\):https://www.cnblogs.com/AKMer/p/9979592.html 浅谈\(fhq\)_\(treap\):https://www.cnblogs.com ...

  5. c# namespace不能和class的name 相同

    比如namespace A, 内部Class A, 那么调用class A的方法只能通过A.A.XXX来访问. 或者说实例化一个class A,  A a = new A(); // compile ...

  6. Oracle获取日期的特定部分

    (1)oracle中extract()函数从oracle 9i中引入,用于从一个date或者interval类型中截取到特定的部分 ,语法:extract ({ year | month | day ...

  7. <正则吃饺子> :关于redis配置文件参数详解

    来源于网络博文,感谢作者的分享,转载只为学习,方便查找,原文地址:http://blog.csdn.net/ljl890705/article/details/51540427 Redis是一个应用非 ...

  8. JavaScript高级程序设计学习笔记第三章--基本概念

    一.标识符: 1.区分大小写 2.命名规则: 第一个字符必须是一个字母.下划线(_)或一个美元符号($) 其他字符可以是字母.下划线.美元符号或数字 标识符中的字母也可以包含扩展的 ASCII 或 U ...

  9. [zoj3195]Design the city(LCA)

    解题关键:求树上三点间的最短距离. 解题关键:$ans = (dis(a,b) + dis(a,c) + dis(b,c))/2$ //#pragma comment(linker, "/S ...

  10. 《精通Spring4.X企业应用开发实战》读后感第五章(注入参数详解)