| 网站首页 | 硬件维修 | 应用学院 | 网络组建 | 网站制作 | 菜鸟黑客 | 编程之道 | 数码大全 | 娱乐休闲 | 软件下载 | 在线视频 | 请您留言 | 技术论坛 | 
专 题 栏 目
最 新 热 门
最 新 推 荐
相 关 文 章
  • 用meta标签来增强网页功能

  • 基于Web标准的UI组件 — 菜单…

  • 使用Web标准建站第10天:自适…

  • IE支持的html元素的disable在…

  • tbody标签的妙用

  • “画中画”效果--谈IFRAME标…

  • Cool Web Scrollbars - 定制…

  • HTML文档中小meta标签的大作…

  • 利用CSS控制打印

  • 利用css里expression来实现界…

  • Q
    您现在的位置: 我是IT人 >> 网站制作 >> 网页设计 >> HTML >> 文章正文
    利用javascript创建功能强大的GUI(2)           
    利用javascript创建功能强大的GUI(2)
    作者:网络 文章来源:转载 点击数: 更新时间:2006-1-4
    [ 字体:缩小 正常 放大 | 双击自动滚屏 ]
    请选择合适的字体颜色:
      我们首先来创建一个拥有三个按钮的简单工具条:一个粗体按钮,一个斜体按钮,一个连接按钮。该工具栏是向一个现有的文本域添加功能的好方法,它可以让用户在无需了解HTML的情况下对输入的文本进行简单的控制。任何让用户参与或进行反馈的网站都可以利用这一工具栏进行加强。

      我们的工具栏在功能上可以分为下面4个部分:
      ·封装选定文本附件HTML标记的JavaScript函数
      ·定制工具栏、按钮的外观和风格的样式表
      ·响应鼠标事件的JavaScript函数
      ·包含工具栏代码、图像、表格元素的HTML

      我们首先来研究一下二个处理向<textarea>插入HTML代码的函数:

      利用JavaScript处理文本集

    function format_sel(v) {
    var str = document.selection.createRange().text;
    document.my_form.my_textarea.focus();
    var sel = document.selection.createRange();
    sel.text = "<" + v + ">" + str + "<" + v + ">";
    return;
    }
      format_sel()只接受一个参数,即表示作用于选定文本的HTML标记的字符串。在这个工具栏中,我们用这个函数来控制<b>和<i>之间的文本。当然,如果愿意,我们可以使用<strong>和<em>替换<b>和<i>,或者使用这个函数控制一段选定的文本,或者在选择的标记中限定指定文本。

      我们可以使用selection对象的createRange()方法方便地创建当前文本的TextRange对象。通过访问其text属性,我们可以得到<textarea>中选定的文本。text属性将被赋给一个局部变量。在下一行中,我们对<textarea>调用了focus(),这一行代码非常重要,否则,我们对文本的改变可能会被写到网页的其他部分去。最后,我们创建了指定文本的另一个引用,并赋给它一个新值:即位于适当的HTML标记中的原来的selection的地址。

    [1]

    文章录入:54iter    责任编辑:54iter 
  • 上一篇文章:

  • 下一篇文章:
  • 发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
    网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    | 设为首页 | 加入收藏 | 联系站长 | 关于我们 | 友情链接 | 版权申明 |