function sortUp(obj)//向上移动
{
var targetOptions=document.getElementById(obj);//提取操作的对象集合,也就是需要操作的select
if(targetOptions!=undefined)
{
var length=targetOptions.options.length;
if(length>0){
for(index=0;index<length;index++)
{
if(targetOptions.options[index].selected)
{
if(index!=0)
{
var targetArr=targetOptions.options;//得到当前可操作项的数组
var option=new Option();
option.id=targetOptions.options[index-1].id;
option.name=targetOptions.options[index-1].name;
option.value=targetOptions.options[index-1].value;
option.text=targetOptions.options[index-1].text;
targetOptions.options[index-1].id=targetOptions.options[index].id;
targetOptions.options[index-1].name=targetOptions.options[index].name;
targetOptions.options[index-1].value=targetOptions.options[index].value;
targetOptions.options[index-1].text=targetOptions.options[index].text;
targetOptions.options[index]=option;
targetOptions.options[index-1].selected=true;
//connectID();connectText();
}
}
}
}else{
alert("请先添加项!");
}
}else{
alert("请先添加项!");
}
}
function sortDown(obj){//向下移动
var targetOptions=document.getElementById(obj);//提取操作的对象集合,也就是需要操作的select
if(targetOptions!=undefined){
var length=targetOptions.options.length;
if(length>0){
for(index=0;index<length;index++)
{
if(targetOptions.options[index].selected)
{
if(index!=length-1)
{
var targetArr=targetOptions.options;//得到当前可操作项的数组
var option=new Option();
option.id=targetOptions.options[index+1].id;
option.name=targetOptions.options[index+1].name;
option.value=targetOptions.options[index+1].value;
option.text=targetOptions.options[index+1].text;
//option=targetOptions.options[index+1];
targetOptions.options[index+1].id=targetOptions.options[index].id;
targetOptions.options[index+1].name=targetOptions.options[index].name;
targetOptions.options[index+1].value=targetOptions.options[index].value;
targetOptions.options[index+1].text=targetOptions.options[index].text;
targetOptions.options[index]=option;
targetOptions.options[index+1].selected=true;
break;
}
}
}
}else{
alert("请先添加项!");
}
}else{
alert("请先添加项!");
}
}
来自:
http://blog.csdn.net/duxingke001/article/details/6325436
分享到:
相关推荐
这个项目是关于如何实现一个功能,使得在HTML `<select>` 元素中的 `<option>` 选项能够通过左右、上下移动来改变它们的顺序。这个特性对于创建具有可定制排序的列表非常有用,比如在编辑模式下,用户可以根据自己的...
总的来说,实现`<select>`元素中`<option>`的上下移动是通过JavaScript对DOM操作的一种应用,它涉及到了对`<select>`和`<option>`元素的属性访问、数组操作以及事件监听。这种功能对于创建自定义的下拉列表排序界面...
在本文中,我们将探讨如何使用JavaScript实现一个下拉列表中Select和Option元素的上下左右移动功能。 下拉列表是网页表单中常见的一种元素,通常用来提供用户一系列可选择的选项。Select和Option是HTML中用于创建...
当需要对这些选项进行动态排序,比如允许用户通过上下移动来调整选项的顺序时,就需要用到“select框上下移动排序”的技术。这个功能在很多应用场景中都很常见,比如任务管理、优先级设置等,它可以提升用户的交互...
对于调整Option在Select中的顺序,`fnUp()`函数提供了一个例子,允许用户将选中的Option与其上方的Option交换位置。这通过遍历Select的选项,检查每个选中的Option,然后交换它们的位置来完成。 除了上述基本操作...
虽然题目中提到了“JsSelect移动”,但这个术语在标准的JavaScript中并不常见。通常,我们直接使用JavaScript(而不是jQuery)来实现类似的功能。不过,由于jQuery库的广泛使用和便利性,这里推荐使用jQuery实现。...
在本文中,我们将深入探讨如何使用 jQuery 来实现 Select 元素中的选项上移、下移、左移和右移功能。这对于需要动态调整选择项顺序的交互式应用非常有用,比如在线表单编辑或者配置工具。让我们逐一解析这个主题。 ...
按下`Tab`键可以聚焦到`select`元素上,然后使用`上下箭头`键可以在选项之间移动,按下`Enter`键可以选择当前选中的选项。然而,如果需要自定义键盘交互或者在不完全支持键盘导航的环境中,可以通过JavaScript进行...
在这个场景中,用于将第一个下拉框的选项顺序反转后再移动到第二个下拉框,以实现"全部向右移"的功能。 10. 在开发类似的小程序时,需要注意对于用户交互的友好性。比如,在移动选项之前进行选择的检查,以及在没有...
通过学习和理解这些知识点,开发者能够更有效地在自己的项目中实现类似功能,提升应用程序的交互性和用户友好度。如果你正在处理与`selectList`相关的开发任务,阅读和研究这篇文章将大有裨益。
为了实现listbox列表框项目上下移动的功能,可以通过编写JavaScript函数来操作DOM中的option元素。这段代码的目的是为listbox列表框提供一个方法,使得选定的选项能够向上或向下移动。 函数listbox_move接受两个...
在数据恢复过程中,为了保证选项顺序的一致性,需要一个排序函数`sort_Main`来将移除的option按照原有的顺序重新插入到Select中。该函数通过遍历保存的`Item_org`数组,按照value和text属性对辅助Select中的option...
该文档主要讲述了使用JavaScript语言来实现对网页中下拉列表框(select元素)进行数据项增加、删除以及上下排序的操作。具体涉及到的技术知识点有: 1. JavaScript操作DOM:包括通过JavaScript创建新的option元素、...
本篇文章将详细讲解如何用JavaScript实现这样的功能,并且支持上下移动已选择的选项。 首先,来看一下HTML部分,它包含了两个`<select>`元素,一个代表左边列表(list1),另一个代表右边列表(list2)。每个`...
本例中,我们学习了如何利用`ondblclick`事件、`<select>`和`<option>`标签以及JavaScript的DOM操作来实现在两个下拉列表间移动选项的功能。这样的技术在实际的项目中非常实用,比如在进行分类管理或数据筛选时。...
本文将详细介绍如何使用 JavaScript 实现 Select 列表中的选项上移和下移功能,这对于动态调整列表顺序,尤其是用户自定义排序的场景十分有用。 首先,我们需要理解 Select 元素在 HTML 中的作用。Select 元素用于...
在本文中,我们将深入探讨Select菜单的设计原理、用途以及如何在不同编程环境中实现它。 1. **菜单与Select菜单的基本概念** - **菜单**:在计算机软件中,菜单是一系列可点击的选项,它们排列在一起,提供给用户...
在这个实例中,我们看到如何使用JavaScript来实现ListBox中选项的动态移动,包括上移、下移、左移和右移的功能。这个功能常用于需要调整列表顺序或者在两个ListBox之间交换项目的场景。 首先,我们来看一下HTML部分...
首先,我们需要了解JavaScript的基础,它是Web开发中的客户端脚本语言,用于实现动态交互效果。穿梭框的实现通常基于HTML、CSS和JavaScript的组合。HTML提供结构,CSS负责样式,而JavaScript处理用户交互和逻辑。 ...