当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 利用JavaScript创建功能强大的GUI(1)

Javascript
提高网站信任度的技巧
javascript脚本编程解决考试分数统计问题
图片上传之前检查大小、尺寸、格式并预览的js代码
JavaScript打开客户端exe文件的代码
JavaScript confirm选择判断
javascript title闪动效果
javascript把15位身份证转成18的函数
新人报道,发个小技巧(js数组重复判断)
Javascript this关键字使用分析
javascript TextArea动态显示剩余字符
JavaScript Undefined,Null类型和NaN值区别
javascript Select标记中options操作方法集合
javascript trim 去空格函数实现代码
javascript网页关闭时提醒效果脚本
checkbox 多选框 联动实现代码
收集的比较全的automation服务器不能创建对象 异常原因和解决方法
Javascript客户端将指定区域导出到Word、Excel的代码
IE浏览器兼容Firefox的JS脚本的代码
在html页面中包含共享页面的方法
javascript replace()用法详解附实例代码

Javascript 中的 利用JavaScript创建功能强大的GUI(1)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-03   浏览: 341 ::
收藏到网摘: n/a

  大多数的计算机用户都非常熟悉Windows的图形用户界面(GUI),都通过使用Word或微软的电子邮件客户端软件了解了按钮、工具条、标签,但与客户端软件都拥有几乎一致的界面截然不同的是,我们可以发现,每个网站的界面都

各不相同。用户需要学会如何使用每一种互联网应用程序。尽管大多数的互联网应用程序都不是太复杂,但一个用户需要不断地去学习应用程序界面,时时感觉自己象个新手,这对于用户而言,毕竟不是一件令人愉快的事。

  通过利用JavaScript和CSS建立互联网应用程序或网站的标准化的客户端界面组件,可以使用户一眼就看出来他们可以进行的操作以及如何完成自己的任务。用户就会对自己的操作更有信心,也不会轻易出现误操作。

  或许你还不知道JavaScript还有这样的功能,或曾经在其他网站上看到过工具栏,但不知道它是如何完成的。在本篇文章中,我们将讨论如何建立一个简单的、格式化工具栏(就象Word中的那样),该工具栏可以为任意的网站添加让用户通过<textarea>区进行反馈的功能。本篇文章介绍的技巧需要读者具备有HTML、CSS和JavaScript方面的知识。

一点不足之处

  下面的代码使用了selection对象的createRange()方法,不幸的是,只有Windows平台上的IE4+用户才能够使用selection对象,相似的功能通过文档对象模型(DOM)才能实现,但Mozilla中的document.createRange()会发生问题,主要是在input或textarea元素中不能处理文本数据。如果这一bug解决了,就可以使下面的代码运行在Mozilla、Netscape 6+或其他任何运行Gecko的浏览器平台上。

建立一个简单的工具栏