注册 | 登陆

您的位置：阿里西西 > 网页特效 > 导航菜单 > 详细内容

0顶

可调整的列表菜单项

稿源：互联网 2022-05-31 17:16:05 点击： 450 撤稿纠错

可调整的列表菜单项的排列顺序，更多脚本特效就上阿里西西网站。

以下讨论的是和列表菜单相关的可调整的列表菜单项教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

要完成此效果需要两个步骤

第一步：把如下代码加入到<head>区域中

<script>
function move(index,to) {
var list = document.form.list;
var total = list.options.length-1;
if (index == -1) return false;
if (to == +1 && index == total) return false;
if (to == -1 && index == 0) return false;
var items = new Array;
var values = new Array;
for (i = total; i >= 0; i--) {
items[i] = list.options[i].text;
values[i] = list.options[i].value;
}
for (i = total; i >= 0; i--) {
if (index == i) {
list.options[i + to] = new Option(items[i],values[i + to], 0, 1);
list.options[i] = new Option(items[i + to], values[i]);
i--;
}
else {
list.options[i] = new Option(items[i], values[i]);
   }
}
list.focus();
}
function submitForm() {
var list = document.form.list;
var theList = "?";
for (i = 0; i <= list.options.length-1; i++) { 
theList += "list" + list.options[i].value + "=" + list.options[i].text;
if (i != list.options.length-1) theList += "&";
}
location.href = document.form.action + theList;
}
</script>

第二步：把如下代码加入到<body>区域中

<form method="GET" action="" name="form">
<table>
<tr>
<td align="middle">
<select name="list" size="4">
<option value="1">类目-A</option>
<option value="2">类目-B</option>
<option value="3">类目-C</option>
<option value="4">类目-D</option>
</select><br><br>
<input type="button" value="submit" onClick="submitForm()">
</td>
<td valign="top">
<input type="button" value="↑" 
onClick="move(this.form.list.selectedIndex,-1)"><br><br>
<input type="button" value="↓"
onClick="move(this.form.list.selectedIndex,+1)">
</td>
</tr>
</table>
</form>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

关于可调整的列表菜单项的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200807153275.shtml方便下次再访问哦。

·上一篇： 只能选择一个的复选框
·下一篇： 这个也是生成随机数字的

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »