简单模拟下拉组合框

最新推荐文章于 2024-11-13 15:28:42 发布

原创最新推荐文章于 2024-11-13 15:28:42 发布 · 1.4k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#脚本 #function #数据库 #input #.net

DHTML原创专栏收录该内容

3 篇文章

订阅专栏

博客涉及脚本、.NET和数据库相关内容。脚本在工作中发挥作用，.NET是重要技术，数据库则是数据存储和管理的关键，input和function可能是脚本或程序中的元素，整体围绕信息技术领域的工作展开。

简单模拟下拉组合框 rel="stylesheet" href="../images/test.css" type="text/css">

简单模拟下拉组合框

-- Sailflying

动机：

文章发布系统中，在后台的输入界面中需要将输入的文章归档，这时需要输入文章所属类型。当类型数目巨大时，即使是熟悉所有类型的人员，在操作中也容易错输、误输。而且在数据库中一旦查不到这个输入值的话，就会自动增加一个新的类型。

这就需要在输入的时候有个备用查询，并且还能够自动输入。这样可以减轻录入人员的工作量，同时减少错输、误输的几率。

针对这种出现次数较多而且这项功能可以通用到其他众多模块，因此添加了这个模拟功能。

材料：

表单域 (form_name)

文本框 (textfield_name)

下拉列表框 (select_name)

思路：

1)在文本框中可以输入数值；同时又可以从列表中选择已经存在的备用值

2)需要将下拉列表框中选中的值传给文本框，并显示出来

3)动态改变文本框和下拉列表框的宽度，以满足输入和选择之间的需求方式

效果：

( 可以手动输入，也可以自动选择输入 )

代码：

自定义函数：ShowToText (将列表项中的值传递给文本框)

function ShowToText(){ document.form_name.textfield_name.value=document.form_name.select_name.options[document.form_name.select_name.selectedIndex].value
}

自定义函数：ChangeWidth (动态改变文本框和下拉框的宽度，num为状态切换的判断参数)

表单源码

后记：

我在这里只作出了一个能够完成功能的雏形，在动态转换的时候还是有偏移，另一个就是文本框和下拉框之间的间隙太大，我通过样式表控制后情况也还存在。
有哪位高手知道如何修进的话，请一定通知我。