(一)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. bootstrap bootstrapvalidator插件+adjax验证使用

    1.利用bootstrap Validator表单验证进行表单验证需要如下CSS和JS. <link rel="stylesheet" type="text/css ...

  2. 使用CSS让元素尺寸缩小时保持宽高比例一致

    CSS中有一个属性padding对元素宽度存在依存关系.如果一个元素的 padding属性以百分比形式表示,padding 的大小是以该元素自身宽度为参照的. 若想要元素尺寸变化时,宽高比例不变,可以 ...

  3. 子树(LintCode)

    子树 有两个不同大小的二进制树: T1 有上百万的节点:T2 有好几百的节点.请设计一种算法,判定 T2 是否为 T1的子树. 样例 下面的例子中 T2 是 T1 的子树: 1 3 / \ / T1 ...

  4. 启动Ubuntu时出现 /dev/sda2 clean 和 /dev/sda2 recovering journal 现象的解决办法

    最近在Ubuntu 18.4上安装Nvidia显卡后,显卡似乎总是不能完全兼容. 第一次出现问题时,是登录账号后,发现系统采用了默认显卡驱动,而已装过的显卡驱动则有损坏导致无法使用. 第二次出现问题时 ...

  5. XPath语法和CSS选择器介绍

    XPath语法 XPath 是一门在 XML 文档中查找信息的语言.XPath 可用来在 XML 文档中对元素和属性进行遍历.XPath 是 W3C XSLT 标准的主要元素,并且 XQuery 和 ...

  6. python Tkinter 写一个弹球的小游戏

    #!usr/bin/python #-*- coding:utf-8 -*- from Tkinter import * import Tkinter import random import tim ...

  7. poj 1681(Gauss 消元)

    Painter's Problem Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 5875   Accepted: 2825 ...

  8. BZOJ 1042:[HAOI2008]硬币购物(容斥原理+DP)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1042 [题目大意] 硬币购物一共有4种硬币.面值分别为c1,c2,c3,c4. 某人去 ...

  9. Problem D: 零起点学算法95——弓型矩阵

    #include<stdio.h> #include<string.h> int main() { ][]; while(scanf("%d%d",& ...

  10. ie8以下浏览器注意事项

    ie8以下ajax请求或者socket请求时一定要加二级域名:(目的不能垮域访问)