select onchange 事件的触发

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

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

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

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

...
tableType = getTableType(DNS, port, DBName, tableName);
if(tableType == 1){
    $("#type").val("1");
}else if (tableType == 2){
    $("#type").val("2");
}
...

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

修改后的代码如下:

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

或者:

...
tableType = getTableType(DNS, port, DBName, tableName);
if(tableType == 1){
    $("#type").val("1").change();
}else if (tableType == 2){
    $("#type").val("2").change();
}
...
时间: 2024-08-10 02:08:42

select onchange 事件的触发的相关文章

input的onchange事件实际触发条件与解决方法

nput中onchange事件已经属于元老级别了,并且现在同onclick一样使用频率很高,然而onchange的机制实际上有很多童鞋并不清楚,我们通过实例来分析这个事件的特征. 触发onchange 首先页面有一个input标签,并且已绑定onchange事件,如: <input type="text" onchange="console.log(this.value);" /> 这个事件要做的动作很简单,只是把input的值在控制台上打印出来就好.效

select onchange事件的使用

<select name="expireDay" id="expireDay" class="form-control" onchange="searchChange(this.options[this.options.selectedIndex].value);"><!-- <option value="" >---请选择---</option> --> &

select onchange事件,选择第一个时没反应

解决方法: <select id="zhouqi" class="select" size="1" name="periodicId" style="color:gray;" > <option value="0" selected="selected" style="display: none;"></option&

js代码赋值触发select控件的onchange事件

嗯,现在在一个小公司实习,直接接触代码收获不小.  现在有个需求是4级联动的select过滤,需要js代码赋值并触发onchange来调用ajax方法,于是问题是怎样触发,找了些资料并且自己尝试了一下,验证无误. 代码在chrome.IE8.ff浏览器测试均通过,记在这里以备查阅~ <html> <head> </head> <body> <select id="sel" name="mysel" onchang

实现页面加载完后触发select的onchange事件

1 如题,很多时候打开页面要直接在select里面执行onchange()事件进行逻辑处理,所以可以在window.load来实现即可. <script>window.onload = function(){ var obj = document.getElementById("time_type"); if(window.event) obj.fireEvent("onchange"); else{ var e = document.createEve

jquery触发两次onchange事件

在项目中需要给select绑定改变事件,来触发动作,但是发现改变一次select,onchange方法执行两遍 //公告类别的变更时间联动公告模板$("#test").change(function () { alert(1);}) 后来给select 标签添加一个onchange属性也会触发两次,这个onchange时间的机制是,在获取焦点之后,储存一个select里面的值,当发现这个值改变的时候,触发onchange事件 目前仅在IE8下发现此类问题,我仅测试了IE8/Chrome

select的onChange事件问题解决

一.onChange事件只有在值改变时才可触发,所以必须在每一次选择时(尤其第一次)保证选择的值是改变的! 所以<select name="inv_payee" id="ECS_INVPAYEE" onchange="show_payee();" style="border:1px solid #ccc;">    <option value="个人" selected >个人<

checkbox onchange 事件 ie 下 不能及时触发

if(templatejquery.browser.msie){                ckb.onpropertychange=function()                { UpdateEnableState(current_checklist_ID);}            }else{                ckb.onchange=function()             { UpdateEnableState(current_checklist_ID);

JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参

JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转.传参(selected的值和页面其它元素的值) 代码如下: <script src="jquery.min.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> $(document