JS ListBox的简单功能实现代码

更新时间：2008年10月29日 22:11:41 作者：

这段时间在项目组都是做静态页面，都是些复制粘贴的活，难得碰到个稍微有点难度的页面。后来看到这个页面还不错，可以自己做做看，虽然公司已经有这样的组件，但不想用，反正没什么事，就当多学学JS好了。

页面效果如下：

代码也贴出来跟大家分享：

<!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> <script language="JavaScript" type="text/javascript">  </script> <table width="80%" border="0" align="center" style="margin-top:20px;"> <tr> <td align="right"> <select name="input" size="10" multiple="multiple" id="input" style="width:200px; font-size:16px"> <option>美元/英镑</option> <option>美元/港币</option> <option>美元/新加坡元</option> <option>美元/日元</option> <option>美元/加拿大元</option> <option>美元/欧元</option> </select> </td> <td align="center"> <p> <input type="button" name="Submit" value="增 加" onclick="addIt()"/> </p> <p> <input type="button" name="Submit2" value="删 除" onclick="deleteIt()"/> </p> </td> <td> <select name="output" size="10" multiple="multiple" id="output" style="width:200px; font-size:16px"> </select> </td> </tr> </table> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

JS
ListBox

JavaScript switch case 的用法实例[范围]
JavaScript switch case 的用法实例，大家可以参考下。
2009-09-09
JavaScript中常用数据处理函数groupBy的用法详解
数据处理与分析中,对数据进行分组是非常常见的功能,不论是实际工作中,还是在面试的场景中应用十分广泛,尤其在函数式编程中 groupBy 十分常见,下面我们就来学习一下groupBy的用法吧
2023-12-12
JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法
这篇文章主要介绍了JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法,涉及javascript针对页面元素样式及属性的相关操作技巧,需要的朋友可以参考下
2015-07-07
js通过googleAIP翻译PHP系统的语言配置的实现代码
一同事弄了个系统是php写的，虽然是多语言但没中文！他打算手动翻译2000多个语言配置，真是佩服，知道后想了想，应该有好的法办
2011-10-10
BOM之navigator对象和用户代理检测
navigator对象现在已经成为识别客户端浏览器的事实标准，navigator对象是所有支持javascript的浏览器所共有的。本文将详细介绍navigator对象和用户代理检测。下面跟着小编一起来看下吧
2017-02-02
JS实现checkbox互斥(单选)功能示例
这篇文章主要介绍了JS实现checkbox互斥(单选)功能,涉及JavaScript针对页面元素属性的判断及动态操作相关实现技巧,需要的朋友可以参考下
2019-05-05
json字符串之间的相互转换示例代码
这篇文章主要介绍了json 字符串之间的相互转换 ,通过eval()函数可以将JSON字符串转化为对象，本需要的朋友可以参考下
2014-08-08
谷歌Chrome浏览器扩展程序开发小记
本文给大家记录的是一次谷歌Chrome浏览器扩展程序的开发过程，非常的细致，有类似开发念头的小伙伴们可以来参考下
2016-01-01
手机端网页点击链接触发自动拨打或保存电话的示例代码
通过网页拨打电话，在点击链接时触发自动拨打或保存电话，此方法塞班、安卓与iphone都支持
2014-08-08
highcharts.js数据绑定方式代码实例
这篇文章主要介绍了highcharts.js数据绑定方式代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2019-11-11