//倒序算法
function reverseOption(sel){
for (var i=0; i< Math.floor(sel.options.length/2);i++) {
var temp=new Option('','')
temp.text = sel.options[i].text;
temp.value = sel.options[i].value;
sel.options[i].text = sel.options[sel.options.length-1-i].text;
sel.options[i].value = sel.options[sel.options.length-1-i].value;
sel.options[sel.options.length-1-i].text = temp.text;
sel.options[sel.options.length-1-i].value = temp.value;
}
}
<HTML>
<HEAD>
<META charset="gb2312" content="text/html" http-equiv="Content-Type">
<TITLE>流程维护</TITLE>
<STYLE type="text/css"><!--
.style1 {color: #0000FF}
.style9 { color: #FF0000;
font-weight: bold;
}
.style10 {color: #000000; }
-->
</STYLE>
<LINK href="../../style/style.css" rel="stylesheet" type="text/css">
<SCRIPT src="../../js/xmlhttp.js" type="text/javascript"></SCRIPT>
<SCRIPT language="javascript" type="text/javascript"> function doSubmit(){
//document.frmMain.action="khgl.AddKhInfo.xv?oper=save";
submitForm();
}
</SCRIPT>
</HEAD>
<BODY>
<TABLE border="0" cellpadding="0" cellspacing="0" width="100%">
<TR>
<TD class="place" height="30">
<IMG align="absmiddle" height="13" src="../../images/place-l.gif"
width="14">
</TD>
<TR>
<TD height="30">
</TD>
</TR>
</TR>
<FORM action="" method="post" name="frmMain">
<TABLE border="0" bordercolordark="#ffffff"
bordercolorlight="#333333" cellpadding="0" cellspacing="0"
class="biao-bg1" id="barid" width="60%">
<TR>
<TD class="biao-bg">
<DIV align="right">
流程名称:
</DIV>
</TD>
<TD>
<SELECT class="table2_td" disabled id="LBBH" name="LBBH" size="1"
style="width:150 ;">
<OPTION value="">
--请选择流程名称--
</OPTION>
<OPTION value="1">
通知
</OPTION>
<OPTION selected value="2">
催报催缴
</OPTION>
<OPTION value="42">
234234234
</OPTION>
<OPTION value="24">
rrrr
</OPTION>
<OPTION value="25">
tttt
</OPTION>
<OPTION value="26">
ggggg
</OPTION>
<OPTION value="43">
444444
</OPTION>
<OPTION value="47">
uuuuuuu
</OPTION>
<OPTION value="45">
7777
</OPTION>
</SELECT>
</TD>
</TR>
<TR height="30">
<TD class="biao-bg">
<DIV align="right">
所属机构:
</DIV>
</TD>
<TD>
<SELECT class="table2_td" disabled id="JGBH" name="JGBH" size="1"
style="width:150 ;">
<OPTION value="">
--请选择机构名称--
</OPTION>
<OPTION value="000000000">
全局管理
</OPTION>
<OPTION value="001">
办公室
</OPTION>
<OPTION selected value="002">
流转税科
</OPTION>
</SELECT>
</TD>
</TR>
</TABLE>
<TABLE align="center" border="0" cellpadding="0" cellspacing="0"
class="table1_border" width="60%">
<TR>
<TD class="table1_head_title">
<P>
</TD>
</TR>
<TR>
<TD class="table1_head_line"></TD>
</TR>
<TR>
<TD align="center" valign="middle">
<TABLE bgcolor="#FFFFFF" border="0" cellpadding="0"
cellspacing="1" class="table2_border" id="tb1" width="60%">
<TR>
<TD align="center" bgcolor="#FFFFFF" valign="middle"
width="40%">
<SELECT class="table2_td" id="TreeL" name="TreeL" size="15"
style="width:200;"></SELECT>
</TD>
<TD align="center" class="table2_td_title1" valign="middle"
width="15%">
<INPUT class="btn" name="AddRightBtn"
onclick="moveSelectItem(document.frmMain.TreeL,document.frmMain.TreeR);"
type="button" value="选择>>">
<P>
<INPUT class="btn" name="RemoveRightBtn"
onclick="moveAllItem(document.frmMain.TreeL,document.frmMain.TreeR);"
type="button" value="全选>>">
<P>
</TD>
<TD align="center" bgcolor="#FFFFFF" colspan="2"
valign="middle">
<SELECT class="table2_td" id="TreeR" name="TreeR" size="15"
style="width:200">
<OPTION value="61">
环节1
</OPTION>
<OPTION value="62">
环节2
</OPTION>
<OPTION value="84">
hj4
</OPTION>
<OPTION value="83">
hj3
</OPTION>
</SELECT>
</TD>
<TD align="center" bgcolor="#FFFFFF" colspan="2"
valign="middle">
<INPUT class="btn" onclick="Up();" type="button" value="向上">
<P>
<INPUT class="btn" onclick="Down();" type="button" value="向下">
<P>
<INPUT class="btn" name="RemoveRightBtn"
onclick="moveSelectItem(document.frmMain.TreeR,document.frmMain.TreeL);"
type="button" value="删除">
<P>
<INPUT class="btn" name="RemoveRightBtn"
onclick="moveAllItem(document.frmMain.TreeR,document.frmMain.TreeL);"
type="button" value="全删">
<P>
<TR>
<TD align="center" bgcolor="#FFFFFF" class="table2_btn"
colspan="6" valign="middle">
<INPUT class="btn" name="Submit" onclick="updateFlow();"
type="button" value="修 改">
<INPUT class="btn" name="返 回"
onclick="JAVASCRIPT:history.back();" type="button"
value="返 回">
</TD>
</TR>
</TD>
</TR>
</TABLE>
</TD>
<INPUT id="oper" name="oper" type="hidden">
<INPUT id="NODES" name="NODES" type="hidden" value="">
<INPUT id="FLOWID" name="FLOWID" type="hidden" value="122">
<SCRIPT type="text/javascript">
//==========添加option===============//
/*
var select=document.getElementById("TreeL");
var surl="system.xmlhttp.XMLHTTP.ak?flag=fillNodeList";
var datas=getServerData(surl,'');//发送请求
var rows=datas.split("#");
for(var i=1;i<rows.length;i++) {//遍历属性
var columns=rows[i].split(",");
select.options.add(new Option(columns[1],columns[0]));
}
*/
//===============================//
//向上移动
function Up(){
var sel=document.getElementById("TreeR"); //获取select
var nIndex = sel.selectedIndex; //需要进行操作的select 项的索引
var nLen = sel.length; //select 总共项目数
if ((nLen<1)||(nIndex==0)) return;
if (nIndex<0) {
alert("请选择一个要移动的已选按钮!");
return;
}
var sValue=sel.options[nIndex].value;
var sHTML=sel.options[nIndex].innerHTML;
sel.options[nIndex].value=sel.options[nIndex-1].value;
sel.options[nIndex].innerHTML=sel.options[nIndex-1].innerHTML;
sel.options[nIndex-1].value=sValue;
sel.options[nIndex-1].innerHTML=sHTML;
sel.selectedIndex=nIndex-1;
}
// 排序:向下移动
function Down() {
var sel=document.getElementById("TreeR");
var nIndex = sel.selectedIndex;
var nLen = sel.length;
if ((nLen<1)||(nIndex==nLen-1)) return;
if (nIndex<0) {
alert("请选择一个要移动的已选按钮!");
return;
}
var sValue=sel.options[nIndex].value;
var sHTML=sel.options[nIndex].innerHTML;
sel.options[nIndex].value=sel.options[nIndex+1].value;
sel.options[nIndex].innerHTML=sel.options[nIndex+1].innerHTML;
sel.options[nIndex+1].value=sValue;
sel.options[nIndex+1].innerHTML=sHTML;
sel.selectedIndex=nIndex+1;
}
/**
* 更新流程
*/
var NODES="";
function updateFlow(){
var LBBH=document.getElementById("LBBH").value;//
if(LBBH==""){
alert("请选择流程名称!");
return ;
}
var JGBH=document.getElementById("JGBH").value;//JGBH
if(JGBH==""){
alert("请选择机构!");
return ;
}
//================================================//
var surl="system.xmlhttp.XMLHTTP.ak?flag=checkFlow&JGBH="+JGBH+"&LBBH="+LBBH;
var datas=getServerData(surl,'');//发送请求
if(datas=="true"){
// alert("当前流程名称和所属机构对应的流程已经创建!");
//return ;
}
//================================================//
var locs=document.getElementById("TreeR");
for(var x=locs.length-1;x>=0;x--){
var value=locs.options[x].value;
NODES+="#";
NODES+=x;//序号
NODES+=",";
NODES+=value;//节点ID
}
document.getElementById("NODES").value=NODES;
if(NODES==""){
alert("请选择节点名称!");
return ;
}
document.getElementById("oper").value="update2";
document.frmMain.action="flowdefine.FlowUpdate.xv";
document.frmMain.submit();
}
/**
**添加或者取消option
*/
function moveSelectItem(locs,mylocs){
for(var x=0;x<locs.length;x++){
var opt ;
if (locs.options[x].selected){
opt=new Option();
opt.value=locs.options[x].value;
opt.text=locs.options[x].text;
mylocs.add(opt);
locs.options[x]=null;
}
}
}
/**
**全部添加或者取消option
*/
function moveAllItem(locs,mylocs){
for(var x=locs.length-1;x>=0;x--){
locs.options[x].selected=true;
var opt ;
if (locs.options[x].selected){
opt=new Option();
opt.value=locs.options[x].value;
opt.text=locs.options[x].text;
mylocs.add(opt);
locs.options[x]=null;
}
}
}
function document.frmMain.TreeL.ondblclick(){
moveSelectItem(document.frmMain.TreeL,document.frmMain.TreeR);
}
function document.frmMain.TreeR.ondblclick(){
moveSelectItem(document.frmMain.TreeR,document.frmMain.TreeL);
}
/**
**根据机构填充用户列表
*/
function filluser(obj){
var select=document.getElementById("TreeL");
select.length=0;
var surl="system.xmlhttp.XMLHTTP.ak?flag=fillUSerList&JGBH="+obj.value;
var datas=getServerData(surl,'');//发送请求
var rows=datas.split("#");
for(var i=1;i<rows.length;i++) {//遍历属性
var columns=rows[i].split(",");
select.options.add(new Option(columns[1],columns[0]));
}
}
function add(){
document.frmMain.action="flowdefine.CircleRepair.ak";
document.getElementById("ACCESS_TYPE").value="add";
document.frmMain.submit();
//window.location.href="CircleRepairAdd.html";
}
</SCRIPT>
</TR>
</TABLE>
</FORM>
</TABLE>
</BODY>
</HTML>
分享到:
相关推荐
本文将深入探讨“jQuery Select 上移下移”这一主题,它涉及到如何利用jQuery来实现选择框(Select)中选项的上移和下移功能。 一、jQuery Select 基础 在HTML中,`<select>`元素用于创建下拉列表,而`<option>`...
以下是一个关于如何在`<select>`和`<option>`中添加自定义图片的详细教程。 首先,我们需要理解HTML基础。`<select>`元素创建一个可选列表,用户可以选择其中的一个或多个选项。`<option>`元素定义了下拉列表中的一...
在网页开发中,`<select>`元素用于创建下拉列表,而`<option>`标签则定义了下拉列表中的选项。有时候,我们可能需要在页面加载时预设一个选项为默认选中状态,或者根据用户操作动态改变选中状态。在JavaScript中,这...
根据提供的文件信息,我们可以总结出一系列关于如何使用jQuery来获取不同类型的表单元素(如文本框、单选按钮、复选框以及下拉列表)...这些方法在实际开发中非常实用,能够帮助开发者快速有效地操作页面上的各种元素。
在JavaScript编程中,动态生成`select`元素中的`option`是一项常见的需求,特别是在网页交互或者数据展示时。本文将深入探讨如何使用JavaScript实现这一功能,同时结合提供的`autoSelect.html`和`autoselect.txt`...
在本文中,我们将深入探讨如何使用 jQuery 来实现 Select 元素中的选项上移、下移、左移和右移功能。这对于需要动态调整选择项顺序的交互式应用非常有用,比如在线表单编辑或者配置工具。让我们逐一解析这个主题。 ...
复制代码代码如下: document.getElementById(“selectid”).options.length = 0; 方法二 复制代码代码如下: document.formName.selectName.options.length = 0; 方法三 复制代码代码如下: document....
### JavaScript 操作 Select 和 Option 的方法详解 在网页开发中,`<select>` 元素是一种常见的表单控件,用于收集用户输入的选择项。它通常包含多个 `<option>` 子元素供用户选择。通过 JavaScript,我们可以实现...
去除select当中重复的option并选中当前的option
在JavaScript(JS)编程中,动态添加Select中的Option元素值是一项常见的需求,特别是在网页交互或者数据填充时。这里我们将深入探讨如何实现这个功能,并提供一个实际的案例来演示这一过程。 首先,我们要理解HTML...
js函数方法: 代码如下: [removed]... try { opts = document.getElementById(selectId).getElementsByTagName(‘option’); for (var i in opts) { if (opts[i].defaultSelected) { dom = opts[i]; break; } } } catch
总结来说,本文详细讲解了 Select-Option 在 Webdynpro 中的应用,包括如何新建组件、添加 Select-Option 组件、建立局部节点、设置 Table 控件的 ID、绑定节点、添加 Attributes 和使用 Methods 等内容。
在IT行业中,交互设计是用户体验的关键部分,"select option"的选择项交互是网页或应用程序界面设计中的常见元素。本文将围绕“select option”及其相关的鼠标提示功能进行详细讲解。 "Select option"通常指的是...
这个JS插件就是为了解决这个问题,它扩展了`<select>`的功能,允许我们在`<option>`的`title`属性中插入图标地址,然后在界面上动态渲染这些图标。 接下来,我们要探讨如何使用这个插件。在项目中,首先需要引入...
在Ant Design Vue中,`a-select`组件是一个用于选择项的下拉框,它提供了丰富的交互和样式。在实际开发过程中,我们可能会遇到一个常见问题,即当动态地给`a-select`的`option`赋值后,其`placeholder`属性失效,...
在网页设计中,`<select>`元素和其子元素`<option>`经常被用来创建下拉列表,供用户选择。然而,在某些情况下,特别是在固定宽度的`<select>`元素中,如果`<option>`的内容过长,可能会导致内容显示不全,只显示部分...
用alert()方法显示选中的值 var prov=$("#selProvince option:selected"); var city=$("#selCity option:selected"); var dist=$("#selDistrict option:selected"); alert("省:"+prov.text()+"市:"+...
### JavaScript Select Option 操作...通过以上方法,我们可以非常方便地对 `<select>` 和 `<option>` 进行各种操作,满足网页开发中的各种需求。这些方法不仅能够帮助开发者更好地管理表单数据,还能提高用户体验。
### Webdynpro for ABAP中select option 用法 #### 引言 本文将通过一个具体的应用场景来探讨如何在Webdynpro for ABAP中使用Select Options功能。该应用场景涉及展示一个选择屏幕,用户可以在其中输入航空公司的ID...
当用户点击“上移”或“下移”按钮(或者直接在下拉菜单中使用键盘方向键)时,我们需要获取当前选中的`<option>`,并根据移动方向调整其位置。这通常涉及到元素的插入和删除操作: ```javascript $("#moveUp").on...