`
zxlj2ee
  • 浏览: 35370 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

从一个select到另一个select

阅读更多
<!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>
</head>
<body>
<form   name=meizz>
<table   border=0   cellpadding=0   cellspacing=0>  
   <tr>
<td>  
          <select   id=list1   size=8   ondblclick="moveOption(this, this.form.list2)">  
              <option   value=A>102所  
              <option   value=B>院本部  
              <option   value=C>211长 
              <option   value=D>12所 
              <option   value=E>19所  
              <option   value=F>13所  
              <option   value=G>16所  
              <option   value=H>14所  
          </select>
</td>  
     <td>  
          <select   id=list2   size=8  style="width:100px;"  ondblclick="moveRight(this),putvalue(this.form.list2)">  
          </select>  
      </td>
</tr>  
</table>  
</form>
  <label id="tvalue"></label>
  <script   language="JavaScript"><!--  
  function   moveOption(e1, e2){  
          try{  
                  var   e =  e1.options[e1.selectedIndex];  
                 
  var m=0;

  for(i=0;i<e2.length;i++)  
  {
if(e1.options[e1.selectedIndex].text==e2.options[i].text)
{
m=1;
}
  }
  if(m!=1)
  {
  e2.options.add(new   Option(e.text,   e.value));
  }
  putvalue(e2);
          }       catch(e){}  
  }  
  function moveRight(e2){
  if(e2.selectedIndex!=-1){
  e2.options.remove(e2.selectedIndex);
}
  }
  function putvalue(e2)
  {
   var s="选择的内容:"; 
  for(i=0;i<e2.length;i++)  
  {
  if(i>0)
s=s+","
  s+=e2.options[i].text;
  }
document.getElementById("tvalue").innerHTML=s;
  }
  //--></script>
</body>
</html>
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    子查询是指一条SELECT语句作为另一条SELECT语句的一部分,外层的SELCT语句称为外部查询,内层的SELECT语句称为内部查询(或子查询)

    子查询`(select au_id from titleauthor)`获取所有出版过书籍的作者ID,并将这些ID组成一个列表。外部查询再利用这个列表筛选出所有出版过书籍的作者信息。 #### 五、子查询与其他查询方式的对比 尽管子查询非常...

    两个相关联的select

    两个相关联的select,一个select的选择会影响另一个select的输出结果

    多个select 的互斥选择实现

    在IT行业中,尤其是在前端开发领域,我们经常遇到需要实现互斥选择的情况,即一组多选框(`&lt;select&gt;`元素)之间只能有一个被选中。这样的功能在很多场景下都有应用,比如用户需要从多个选项中单选一个,或者在配置...

    select函数实现一个服务器与多个客户端的通信

    `select`函数的使用可以避免程序陷入繁忙等待,提高系统资源利用率,实现一个服务器与多个客户端的高效通信。 `select`函数的基本语法如下: ```c int select(int nfds, fd_set *readfds, fd_set *writefds, fd_...

    Bootstrap框架下下拉框select搜索功能

    `bootstrap-select`是一个基于Bootstrap的下拉框增强插件,它提供了丰富的自定义选项和交互性,包括搜索功能。这个插件允许用户在下拉框中输入文字,系统会实时地进行模糊匹配,展示与输入文字相关的选项,极大地...

    写一个可编辑的select下拉框

    一个常见的需求是实现一个可编辑的`&lt;select&gt;`下拉框,即允许用户不仅能从下拉列表中选择选项,还能直接输入文本。这种组件结合了传统`&lt;select&gt;`控件的选择功能和`&lt;input&gt;`控件的自由文本输入能力,从而提供更加灵活...

    js从select1选择到select2 左边选择到右边(很好用)

    本教程将深入探讨如何利用JavaScript实现从一个`select`(select1)中选择选项并将其移动到另一个`select`(select2)的过程,这在需要对可选项目进行动态管理的场景中非常实用。 首先,我们需要在HTML中定义两个`...

    select美化HTML的select标签的原始样式,并且不影响原始select的事件方法调用

    `&lt;select&gt;`是HTML中的一个表单元素,它包含一组`&lt;option&gt;`标签,用户可以从这些选项中选择一项。`&lt;option&gt;`标签定义了下拉列表中的各个选项。当用户更改了所选的选项时,`&lt;select&gt;`元素就会触发`change`事件,我们...

    jquery实现 两个select之间option的转移操作

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和Ajax交互等任务。本文将深入探讨如何使用jQuery实现两个`&lt;select&gt;`元素之间的`&lt;option&gt;`选项转移操作,包括全选、单选以及...

    xm-select,一款简单多选的select插件

    在描述中提到,文件包含了DEMO,这对于初学者来说,是一个很好的学习起点,可以通过查看和运行示例代码快速理解插件的工作原理和用法。 其次,XM-SELECT提供了设置默认值的功能。这意味着在页面加载时,下拉框可以...

    select option带自定义图片

    这段JavaScript代码首先将原始的`&lt;option&gt;`元素保存到一个数据属性中,然后用带有图片和文本的`&lt;div&gt;`元素替换它们。当用户选择一个选项时,`&lt;select&gt;`的`change`事件触发,重新渲染选项以反映新的选择。 CSS样式是...

    使select可以输入

    自制的jquery插件,只需要一行代码,即可将select控件变成一个即可以输入也可以选择的元素,输入时也会有智能提示。对原来的select的操作完全没有改变,取值依然是取select的值,设置选中,添加项删除项等等都没有...

    实现可编辑的select

    这两个文件是jQuery的一个插件——Editable Select。jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理和Ajax交互。而Editable Select插件则是基于jQuery的,用于将普通的`select`元素转换为可编辑的...

    jquery实现select互斥联动

    以下是一个简单的jQuery实现,展示了如何在三个`select`元素之间实现互斥联动: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;jQuery Select 互斥联动 &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;&lt;/...

    select 带搜索功能

    HTML中的`&lt;select&gt;`元素用于创建一个可选的列表,用户可以从这些选项中进行选择。例如: ```html &lt;select&gt; &lt;option value="option1"&gt;Option 1 &lt;option value="option2"&gt;Option 2 &lt;!-- 更多选项 --&gt; &lt;/select&gt; ``...

    jquery select 选中值设置左右select选择互换

    当任一select的选中值改变时,它会将当前选中值传递到另一个select,并清除自身的选中状态。这样,用户在任一侧选择一个值后,该值会立即被交换到另一侧,同时自身清空。 在实际应用中,你可能需要根据业务需求进行...

    bootstrap-select2-ztree.zip

    在“select2-ztree”项目中,Select2 被用来创建一个可搜索、可多选的下拉框,用户可以通过这个下拉框来选择需要的项。 ZTree 是一个基于jQuery的树形插件,它支持数据动态加载、拖拽、节点编辑等多种功能。在与...

    select 增加搜索框

    通过以上步骤,你可以为`select`元素添加一个功能完善的搜索框。`Chosen`库不仅提供了搜索功能,还支持多选、宽度自适应等特性,是实现高级下拉列表的一个强大工具。在实际项目中,可以根据具体需求进行调整和定制,...

    select复选框带全选

    在Bootstrap中,"select复选框"通常指的是一个下拉选择列表,其中包含多个可选的选项,用户可以通过勾选这些选项来做出选择。本篇文章将深入探讨如何在Bootstrap中实现带有全选功能的select复选框,以及相关的技术...

Global site tag (gtag.js) - Google Analytics