<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" src="jquery-1.6.2.js"></script>
<script type="text/javascript">
$(function() {
$("#add").click(function(){
$("#first option:selected").appendTo($("#second"));
$("#add_all").click(function() {
$("#first option").appendTo($("#second"));
$("#first").dblclick(function(){
$("#first option:selected").appendTo($("#second"));
$("#remove").click(function() {
$("#second option:selected").appendTo($("#first"));
$("#remove_all").click(function() {
$("#second option").appendTo($("#first"));
$("#moveUpButton").click(function(){
var count = $("#second option:selected").length;//选中的个数
if($("#second option:selected:eq(0)").index()!=0){
for(var i = 0;i < count; i ++){
var selectObj = $("#second option:selected:eq("+i+")");
selectObj.prev().before(selectObj);
$("#moveDownButton").click(function(){
var count = $("#second option:selected").length;//选中的个数
if($("#second option:selected:eq("+(count-1)+")").index()!=($("#second option").length-1)){
for(var i = 0;i < count; i ++){
var selectObj = $("#second option:selected:eq("+(count-i-1)+")");
selectObj.next().after(selectObj);
</script>
</head>
<table width="285" height="169" border="0" align="left" cellpadding="0" cellspacing="0" style="margin:15px 0px 0px 15px;">
<td width="126" style="text-align: center;">
待选择列表
<td width="69" valign="middle"></td>
<td width="127" align="left" style="text-align: center;">
已选择列表
<td width="126" style="text-align: center;">
<!--multiple="multiple" 能同时选择多个 size="10" 确定下拉选的长度-->
<select name="first" size="10" multiple="multiple" class="td3" id="first" style="width: 100px;">
<option value="选项1">选项1</option>
<option value="选项2">选项2</option>
<option value="选项3">选项3</option>
<option value="选项4">选项4</option>
<option value="选项5">选项5</option>
</select>
<td width="69" valign="middle" style="text-align: center;">
<input name="add" id="add" type="button" class="button" value="-->" />
<input name="add_all" id="add_all" type="button" class="button" value="==>" />
<input name="remove" id="remove" type="button" class="button" value="<--" />
<input name="remove_all" id="remove_all" type="button" class="button" value="<==" />
<td width="127" align="left" style="text-align: center;">
<select name="second" size="10" multiple="multiple" class="td3" id="second" style="width: 100px;">
<option value="选项6">选项6</option>
<option value="选项7">选项7</option>
<option value="选项8">选项8</option>
<option value="选项9">选项9</option>
</select>
<td width="126" style="text-align: center;">
<td width="69" valign="middle"></td>
<td width="127" align="left" style="text-align: center;">
<input type="button" value="上移" id="moveUpButton"/>
<input type="button" value="下移" id="moveDownButton"/>
</table>
</body>
</html>
New Document $(function() { $("#add").click(function(){ $("#first option:selected").appendTo($("#second")); }); $("#add_all").click(function() { $("#first option").appendTo($("
1、html代码：为select标签设置multiple属性为true
<select id="myselect" multiple="true">
<option value="1">java</option>
<option value="2">javaSE</option>
<option va
'#message_delivery_status option:selected').each(function(){
status.push($(this).val())
return status.join(",");
js方式:
function getMsgDelStaValue() {
var status=[];
var obj = document.getElementById("xxxx");
<script type="text/javascript">
$(document).ready(function(){
$('#add').click(function(){
var $options = $('#select1 option:selected');//获取当前选中的项
var $remove = $options.remove();...
<div class="options">
<div class="option" data-value="1">选项1</div>
<div class="option" data-value="2">选项2</div>
<div class="option" data-value="3">选项3</div>
<div class="option" data-value="4">选项4</div>
CSS代码：
.multiple-select {
position: relative;
width: 200px;
height: 30px;
border: 1px solid #ccc;
border-radius: 5px;
overflow: hidden;
.select-box {
position: relative;
width: 100%;
height: 100%;
cursor: pointer;
.selected-items {
position: absolute;
top: ;
left: ;
right: 30px;
bottom: ;
padding: 5px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
.arrow {
position: absolute;
top: ;
right: ;
width: 30px;
height: 100%;
background-color: #ccc;
.arrow:before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(45deg);
width: 10px;
height: 10px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
.options {
position: absolute;
top: 100%;
left: ;
width: 100%;
max-height: 200px;
overflow-y: auto;
background-color: #fff;
border: 1px solid #ccc;
border-top: none;
border-radius: 5px 5px;
z-index: 999;
display: none;
.option {
padding: 5px;
cursor: pointer;
.option:hover {
background-color: #f5f5f5;
.option.selected {
background-color: #ccc;
color: #fff;
jQuery代码：
$(function() {
// 点击下拉框
$('.multiple-select .select-box').click(function(e) {
e.stopPropagation();
$('.multiple-select .options').toggle();
// 点击选项
$('.multiple-select .option').click(function(e) {
e.stopPropagation();
var value = $(this).data('value');
var text = $(this).text();
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
$('.multiple-select .selected-items [data-value="' + value + '"]').remove();
} else {
$(this).addClass('selected');
$('.multiple-select .selected-items').append('<span data-value="' + value + '">' + text + '<i class="fa fa-times"></i></span>');
// 点击删除选项
$('.multiple-select .selected-items').on('click', 'span', function(e) {
e.stopPropagation();
var value = $(this).data('value');
$('.multiple-select .option[data-value="' + value + '"]').removeClass('selected');
$(this).remove();
// 点击其他地方隐藏下拉框
$(document).click(function() {
$('.multiple-select .options').hide();
spring中 allowBeanDefinitionOverriding(spring.main.allow-bean-definition-overriding) 分析
xunkoo:
解决httpclient的NoHttpResponseException异常
weixin_56873659:
