jquery 写的 select 左右 挪动的控件
来源:互联网 发布:真人白家乐软件开发 编辑:程序博客网 时间:2024/05/16 04:17
参考了下multiselect的写法,想了想实现应该不难,自己写了
html:
<div class="row"> <div class="col-xs-5"> <select name="test" id="multiselect" class="form-control" size="8" multiple="multiple"> <option value="1">Item 1</option> <option value="2">Item 5</option> <option value="2">Item 2</option> <option value="2">Item 4</option> <option value="3">Item 3</option> </select> </div> <div class="col-xs-2"> <button type="button" id="multiselect_rightAll" (click)="multiselect_rightAll()" class="btn btn-block"><i class="glyphicon glyphicon-forward"></i></button> <button type="button" id="multiselect_rightSelected" (click)="multiselect_rightSelected()" class="btn btn-block"><i class="glyphicon glyphicon-chevron-right"></i></button> <button type="button" id="multiselect_leftSelected" (click)="multiselect_leftSelected()" class="btn btn-block"><i class="glyphicon glyphicon-chevron-left"></i></button> <button type="button" id="multiselect_leftAll" (click)="multiselect_leftAll()" class="btn btn-block"><i class="glyphicon glyphicon-backward"></i></button> </div> <div class="col-xs-5"> <select name="to" id="multiselect_to" class="form-control" size="8" multiple="multiple"></select> </div></div>
jq部分
multiselect_rightAll() { var leftAll = $("#multiselect > option"); leftAll.clone().appendTo("#multiselect_to"); leftAll.remove(); } multiselect_leftAll() { var rightAll = $("#multiselect_to > option"); rightAll.clone().appendTo("#multiselect"); rightAll.remove(); } multiselect_leftSelected() { if($("#multiselect_to option:selected").length > 0) { var selectRight = $("#multiselect_to option:selected"); selectRight.clone().appendTo("#multiselect"); selectRight.remove(); } } multiselect_rightSelected() { if($("#multiselect option:selected").length > 0) { var selectLeft = $("#test option:selected"); selectLeft.clone().appendTo("#multiselect_to"); selectLeft.remove(); }
}
0 0
- jquery 写的 select 左右 挪动的控件
- jquery实现select多选框的左右移动
- jquery写的左右滚动插件
- 一个利用jquery写的左右轮播图
- 基于jQuery的select控件
- jquery实现select框内容的左右移动【经典】
- android 挪动dialog的位置
- android 挪动dialog的位置
- JQuery select控件的相关操作
- JQuery select控件的相关操作
- JQuery select控件的相关操作收集
- JQuery select控件的相关操作
- jquery操作Select等控件的值
- jquery动态获取select控件的option
- Jquery获取Select选中控件的值
- 全部用jquery写的无缝左右滑动轮播图
- 仿照原生系统的图片编辑,自定义控件,可以删除、挪动、放大缩小等
- 超出屏幕的图片随意挪动哦
- MapReduce系列---
- java基于freemarker导出指定word格式带多图片源码。
- jdom处理的XML Document 和String 之间的相互转化
- Mac Chrome 跨域
- 千里之行始于足下,一步之难源于自缚
- jquery 写的 select 左右 挪动的控件
- 美容热点产品
- mysql批量更新数据库的某一个字段
- shell sort
- 网站编程的相关概念
- iOS HTTPS 抓包
- x265 2.1版本更新
- Linux下PHP7使用xhprof分析性能
- TOB产品经理的日常(1)