(一)select2常用的操作:添加、移除、获取选中的value()与text()

  (1)移除事件:$("#select_id").unbind("change");   //为Select移除选择改变事件

  unbind的用法:

    ①定义和用法

    unbind() 方法移除被选元素的事件处理程序。该方法能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行。

    ubind() 适用于任何通过 jQuery 附加的事件处理程序。

    ②取消绑定元素的事件处理程序和函数

    规定从指定元素上删除的一个或多个事件处理程序。如果没有规定参数,unbind() 方法会删除指定元素所有事件处理程序

    语法:$(selector).unbind(event,function)

    示例如下:

$("p").click(function(){
$(this).slideToggle();
});
$("button").click(function(){
$("p").unbind(); //取消元素‘p’的所有应用程序
});

    ③使用 Event 对象来取消绑定事件处理程序

    规定要删除的事件对象。用于对自身内部的事件取消绑定(比如当事件已被触发一定次数之后,删除事件处理程序)。

    如果未规定参数,则 unbind() 方法会删除指定元素的所有事件处理程序。

    语法:$(selector).unbind(eventObj)     示例如下:

  var x=0;
$("p").click(function(e){
$("p").animate({fontSize:"+=5px"}); //动态改变p标签中字体是属性
x++;
if (x>=2)
{
$(this).unbind(e); //this指点击的当前事件,此处用于取消点击事件
}
})

  (2)添加事件

  $("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发;也可以说select_id值发生改变触发该事件

  示例:

//jsp
<select id="druge" class="form-control input-sm" >
</select>
//js
$("#druge").change(function(){
var drugData = $(this).val(); //获取当前事件标签的值
alert("aaaaaaa");
})

  (3) 获取选中项的相关属性:

  $("#select_id").find("option:selected").text();  //获取Select选择的text()

  $("#select_id").val();  //获取Select选择的Value()

  $("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值

  (4) JQuery获取select控件中特定的节点:

  $("#select_id option:first").attr("index");  //获取Select最小的索引值

  $("#select_id option:last").attr("index");  //获取Select最大的索引值

  (5)JQuery设置Select控件选中的项(也就是为select赋初始值):

  $("#select_id ").get(0).selectedIndex=1;  //设置Select索引值为1的项选中

  $("#select_id ").val(4);   // 设置Select的Value值为4的项选中

  $("#select_id option[text='内容]").attr("selected", true);   //设置Select的Text值为jQuery的项选中

  (6) JQuery添加/删除Select的Option项:

  $("#select_id").append("<option value='Value'>Text</option>");  //为Select追加一个Option(下拉项),其中value,text是初始化的值

  $("#select_id").prepend("<option value='0'>请选择</option>");  //为Select插入一个Option(第一个位置)

  $("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)

  $("#select_id option[index='0']").remove();  //删除Select中索引值为0的Option(第一个)

  $("#select_id option[value='3']").remove();  //删除Select中Value='3'的Option

  $("#select_id option[text='4']").remove();  //删除Select中Text='4'的Option

  (二)禁用属性

    可以设置禁用状态disabled,并且设置非常简单,如:$("#select_id").prop("disabled", false);

  (三)赋初始值(默认值设置)

//单选情况
<select class="form-control input-sm" id="job" ></select>

  (1)单选情况:$("#select2").val("初始值").trigger("change");

//多选情况,其中需要加入多选属性multiple="multiple"
<select class="form-control input-sm" id="job" multiple="multiple" ></select>

  (2)多选选情况:$("#select2").val(["1","2"]).trigger("change");  这样传递数组过去。

  示例:

    var jobs=jobId.split(","); //转换为数组,说明:"a,b,c,".split(",")结果为:['a','b','c'];可以发现,自动将结尾的空置去除,这与java中类似

    $("#job").val(jobs).trigger("change");   //这里的jobs传入的一定要是数组

  (四)重点:如何将数据中的数据取出,作为select2的option?

    详细请见下节

jquery操作select2控件的更多相关文章

  1. Jquery 操作Html 控件 CheckBox、Radio、Select 控件 【转】http://www.cnblogs.com/lxblog/archive/2013/01/09/2853056.html

    Jquery 操作Html 控件 CheckBox.Radio.Select 控件   在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio ...

  2. Jquery 操作Html 控件 CheckBox、Radio、Select 控件

    在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一 ...

  3. JQuery 操作基本控件

    根据控件的样式class获取控件 $(".className")......          //className代表的就是控件的样式 根据控件的ID获取控件 $(" ...

  4. jQuery操作select控件取值和设值

    1.级联select的操作,后一个select的值随着前一个select选中值变化 $(".select_A").change(function(){ $(".selec ...

  5. 解决Select2控件不能在jQuery UI Dialog中不能搜索的bug

    本文使用博客园Markdown编辑器进行编辑 1.问题呈现 项目中使用了jQuery UI的Dialog控件,一般用来处理需要提示用户输入或操作的简单页面.逻辑是修改一个广告的图片和标题. 效果截图如 ...

  6. 基于jQuery 常用WEB控件收集

    Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizonta ...

  7. 一些基于jQuery开发的控件

    基于jQuery开发,非常简单的水平方向折叠控件.主页:http://letmehaveblog.blogspot.com/2007/10/haccordion-simple-horizontal-a ...

  8. JQuery动态添加控件并取值

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  9. [WinForm]WinForm跨线程UI操作常用控件类大全

    前言 在C#开发的WinForm窗体程序开发的时候,经常会使用多线程处理一些比较耗时之类的操作.不过会有一个问题:就是涉及到跨线程操作UI元素. 相信才开始接触的人一定会遇上这个问题. 为了解决这个问 ...

随机推荐

  1. 链式前向星实现的堆优化dij求最短路模板

    #include<cstdio> #include<string> #include<cstdlib> #include<cmath> #include ...

  2. CodeForces 734E Anton and Tree

    $dfs$缩点,树形$dp$. 首先将连通块缩点,缩点后形成一个黑白节点相间的树.接下来的任务就是寻找一个$root$,使这棵树以$root$为根,树的高度是最小的(也就是一层一层染色).树形$dp$ ...

  3. 安装 SQL Server 2008 和管理工具 SQL Server 2008 management studio 及相关问题解决

    Sql Server 2008 问题小总结 http://www.lihengyu.com/blog/4877.html 安装 SQL Server 2008 和管理工具 SQL Server 200 ...

  4. 1. Maven - 开始

    今天开始记录Maven的学习过程. ☞ 相关明细 操作系统:win7 参考书籍:<maven-definitive-guide_zh>(Maven权威指南) maven版本:3.3.3 ☞ ...

  5. VMware Workstation的三种网络连接方式

    桥接模式(Bridged).NAT模式(地址转换模式).仅主机模式(Host-Only) 桥接模式就是将主机网卡与虚拟机的网卡利用虚拟网桥进行通信.在桥接的作用下,类似于把物理主机虚拟为一个交换机,所 ...

  6. Flask实战第45天:完成前台登录界面

    我们的注册页面和登录页面有很多相似之处,因此,也可以基于一个模板来实现. 首先创建一个模板html,命名为front_signbase.html, 然后修改注册页面front_signup.html, ...

  7. Xamarin.Forms获取设备屏幕大小

    Xamarin.Forms获取设备屏幕大小 可以借助device.Display获取.基本形式如下: var display = device.Display;然后就可以获取屏幕大小.display. ...

  8. 如何使用weinre来进行远程调试phonegap应用

    使用phonegap开发的应用在真机上和PC上的显示效果以及浏览器渲染方式还是有些区别的.在PC端很好调试,各种浏览器都自带了调试工具,使用起来很方便,但是在一旦安装到了手机上,这个时候要进行调试就需 ...

  9. AtCoder - 3954 Painting Machines

    题面在这里! 题解见注释 /* 考虑一个可以用 K ((n+1)/2 <= K < n)次染黑的方案, 那么将操作前K次的机器从小到大排序,一定是: a1=1 < a2 < . ...

  10. [USACO13NOV]No Change

    题目大意: 你有k(k<=16)个硬币,每个硬币都有自己的面值. 现在你要给n件商品付钱,每件商品也有自己的价格. 然而老板是个奸商,他绝对不会给你找钱. 你每次付钱只能用一个硬币,但是你可以一 ...