jquery实现select多选框的左右移动

来源:未知 责任编辑:责任编辑 发表时间:2015-03-01 01:36 点击:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>无标题文档</title> 
<script type="text/javascript" src="jquery-1.4.4.min.js"></script> 
<script type="text/javascript"> 
/**  
 *动态的给左边的下拉列表创建选项  
 *具体情况可以从数据库读取数据动态创建选项  
 */ 
$(document).ready(function(){  
    for(var i=1;i<=5;i++)  
    {  
    $("#fb_list").append("<option value='"+i+"'>公开招标小型机采购00"+i+"</option>");   
    }  
})  
$(function(){  
  $("#add").click(function(){  
       if($("#fb_list option:selected").length>0)  
       {  
           $("#fb_list option:selected").each(function(){  
              $("#select_list").append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option");  
              $(this).remove();   
           })  
       }  
       else 
       {  
           alert("请选择要添加的分包!");  
       }  
   })  
})  
$(function(){  
      $("#delete").click(function(){  
           if($("#select_list option:selected").length>0)  
           {  
               $("#select_list option:selected").each(function(){  
                     $("#fb_list").append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option");  
                     $(this).remove();   
               })  
           }  
           else 
           {  
               alert("请选择要删除的分包!");  
           }  
     })  
}) 
</script> 
</head> 
 
<body> 
<table width="95%" cellpadding="0" align="center" class="listshow" border="1" cellspacing="0">  
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码:点击我更换图片
最新评论 更多>>

推荐热点

  • Gb2312转utf-8编码的方法(vbs+js)
  • 如何使用Ajax技术开发Web应用程序(1)
  • JavaScript模仿桌面窗口
  • js跳转路径问题
  • jquery学习笔记---jqGrid学习笔记 完整整理
  • 运用JavaScript构建你的第一个Metro式应用程序(on Windows
  • 2011年度最佳 jQuery 插件
  • 我知道的JavaScript -- 设计模式(桥接)应用之 – 验证器
  • 我是如何去了解jquery的(六),案例之幻灯片轮换
网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索 - 移动版 - 返回顶部
Copyright © 2008-2013 计算机技术学习交流网. 版权所有

豫ICP备11007008号-1