EasyUi下拉框选值时触发js事件。

简介: EasyUi下拉框选值时触发js事件。

具体实列:

<td><select name="politicalType" id="politicalType" style="width:150px;" 
class="easyui-combobox" data-options="editable:false" onchange="change()">
 <option value="1" <c:if test="${custom.politicalType==1}">selected="selected"</c:if>>中共党员</option>
 <option value="2" <c:if test="${custom.politicalType==2}">selected="selected"</c:if>>中共预备党员</option>
 <option value="3" <c:if test="${custom.politicalType==3}">selected="selected"</c:if>>共青团员</option>
 <option value="4" <c:if test="${custom.politicalType==4}">selected="selected"</c:if>>民革党员</option>
 <option value="5" <c:if test="${custom.politicalType==5}">selected="selected"</c:if>>民盟盟员</option>
 <option value="6" <c:if test="${custom.politicalType==6}">selected="selected"</c:if>>民建会员</option>
 <option value="7" <c:if test="${custom.politicalType==7}">selected="selected"</c:if>>民进会员</option>
 <option value="8" <c:if test="${custom.politicalType==8}">selected="selected"</c:if>>农工党党员</option>
 <option value="9" <c:if test="${custom.politicalType==9}">selected="selected"</c:if>>致公党党员</option>
 <option value="10" <c:if test="${custom.politicalType==10}">selected="selected"</c:if>>九三学社社员</option>
 <option value="11" <c:if test="${custom.politicalType==11}">selected="selected"</c:if>>台盟盟员</option>
 <option value="12" <c:if test="${custom.politicalType==12}">selected="selected"</c:if>>无党派人士</option>
 <option value="13" <c:if test="${custom.politicalType==13}">selected="selected"</c:if>>群众</option>             
</select></td>

js触发下拉事件:

$("#politicalType").combobox({
            onSelect: function () {
            var newPtion = $("#politicalType").combobox('getText')
            if (newPtion == "中共党员") {
                $('#partyBranchId').combobox('enable'); //允许easyui下拉框使用
                $('#subjection').textbox('textbox').attr('readonly',false); //允许easyui文本框使用
                $('#partyDuties').textbox('textbox').attr('readonly',false);
                $('#partyFee').textbox('textbox').attr('readonly',false);
                $('#joinPartyDate').datebox('enable');
            }
            else {
                //党建信息
                $('#partyBranchId').combobox('disable');   //禁止easyui下拉框使用
                $('#subjection').textbox('textbox').attr('readonly',true); //禁止easyui文本框使用
                $('#partyDuties').textbox('textbox').attr('readonly',true);
                $('#partyFee').textbox('textbox').attr('readonly',true);
                $('#joinPartyDate').datebox('disable');
             }
         }
        });
相关文章
|
6天前
|
JavaScript 前端开发
js开发:请解释事件冒泡和事件捕获。
JavaScript中的事件处理有冒泡和捕获两种方式。事件冒泡是从子元素向上级元素传递,而事件捕获则从外层元素向内层传递。`addEventListener`的第三个参数可设定事件模式,`false`或不设为冒泡,`true`为捕获。示例代码展示了如何设置。
24 2
|
4天前
|
消息中间件 存储 设计模式
JavaScript发布订阅模式:实现事件驱动编程!
JavaScript发布订阅模式:实现事件驱动编程!
|
4天前
|
设计模式 存储 消息中间件
JavaScript观察者模式:实现对象间的事件通信!
JavaScript观察者模式:实现对象间的事件通信!
|
6天前
|
JavaScript 前端开发 开发者
javascript事件大全
javascript事件大全
13 1
|
6天前
|
JavaScript 前端开发
Javascript的一些监听事件
Javascript的一些监听事件
13 2
|
6天前
|
JavaScript 前端开发
js的事件介绍
js的事件介绍
16 1
|
6天前
|
JavaScript 前端开发
js的事件
js的事件
15 1
|
6天前
|
JavaScript 前端开发
js的交互事件
js的交互事件
15 1
|
6天前
|
JavaScript 前端开发 C++
【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
【5月更文挑战第2天】【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
|
6天前
|
JavaScript 前端开发 开发者
【JavaScript技术专栏】JavaScript事件处理机制详解
【4月更文挑战第30天】本文探讨JavaScript中的事件处理机制,涉及事件类型(如click、mouseover)、事件流(冒泡型、捕获型及目标阶段)、事件处理函数(内联与addEventListener方法)以及事件委托(用于优化内存和处理动态元素)。此外,还介绍了事件取消,通过`preventDefault()`和`stopPropagation()`控制事件行为。理解这些概念对构建交互式Web应用至关重要。