本文主要为大家介绍了双向select控件Bootstrap Dual ListBox的使用方法，Bootstrap Dual列表是一个为响应Twitter优化的列表框插件，它可以用在所有的现代浏览器和触摸设备上，分享给大家，具体如下：
效果图：
一、使用
1、引用css和js文件
本文主要为大家介绍了双向select控件Bootstrap Dual ListBox的使用方法，Bootstrap Dual列表是一个为响应Twitter优化的列表框插件，它可以用在所有的现代浏览器和触摸设备上，分享给大家，具体如下：
效果图：
1、引用css和js文件
2、初始化class属性为demo1的select元素
$("#showValue").click(function () {
alert($('[name="duallistBox_demo1"]').val());
});
});
3、HTML代码
一个通用的、初始化数据的js函数：
调用：
$("#showValue").click(function () {
alert($('[name="duallistBox_demo2"]').val());
});
});
DataHandler.ashx代码：
using System;
using System.Web;
using System.Collections.Generic;
using Newtonsoft.Json;
public class DataHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
var china = new { id = "China",name = "中国" };
var usa = new { id = "USA",name = "美国" };
var rsa = new { id = "Russia",name = "俄罗斯" };
var en = new { id = "English",name = "英国" };
var fra = new { id = "France",name = "法国" };
List
public bool IsReusable {
get {
return false;
}
}
}
效果：
本文的demo使用的开发环境：VS2013、.NET Framework4.5.
如果大家还想深入学习，可以点击进行学习，再为大家附两个精彩的专题：
原文链接：https://www.f2er.com/jquery/51137.html