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

Javascript
jQuery生成asp.net服务器控件的代码
javascript 实现的完全兼容鼠标滚轴缩放图片的代码
JavaScript学习笔记(十七)js 优化
使用SyntaxHighlighter实现HTML高亮显示代码的方法
javascript contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
利用jQuery 实现GridView异步排序、分页的代码
jquery.lazyload 实现图片延迟加载jquery插件
Lazy Load 延迟加载图片的 jQuery 插件
jquery 插件实现图片延迟加载效果代码
javascript小数计算出现近似值的解决办法
jquery1.4后 jqDrag 拖动 不可用
jquery 应用代码 方便的排序功能
选择TreeView控件的树状数据节点的JS方法(jquery)
jquery 图片Silhouette Fadeins渐显效果
JQuery Dialog(JS 模态窗口,可拖拽的DIV)
javascript 同时在IE和FireFox获取KeyCode的代码
js 键盘记录实现(兼容FireFox和IE)
javascript 函数速查表
jQuery AnythingSlider滑动效果插件
经典海量jQuery插件 大家可以收藏一下

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-03   浏览: 39 ::
收藏到网摘: 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的浏览器平台上。

建立一个简单的工具栏