JavaScript初级教程(第五课)第2/4页

    文字域可以链接onBlur、onFocus和onChange事件。当有人点击文字域的里边时则发生onFocus事件。而如果点击文字域的外面或按了tab键时则发生onblur事件。如果有人改变了文字域内的内容然后转到文字域外部的区域时则发生onChange事件。

    试着做这些事情看下面的文字域会发生什么情况。

    以下是编制方法：文字域的编码：

    <input type="text" name="first_text" onFocus="writeIt('focus');" onBlur="writeIt('blur');" onChange="writeIt('change');">

    每一个事件处理器调用函数writeIt()，该函数已作了定义。编码如下：

    <script language="JavaScript">
    <!-- hide me
        function writeIt(the_word)
        {
            var word_with_return = the_word + "\n";
            window.document.first_form.the_textarea.value += word_with_return;
        }
    // show me -->
    </script>

    前几行是典型的JavaScript预定义。主体中的第1行

    var word_with_return = the_word + "\n";

    将一个变量word_with_return进行初始化为函数处理后的字符串并加上换行符"\n".。注意"\n" 是标准的计算机指令。

    下一行

    window.document.first_form.the_textarea.value += word_with_return;

    将文字区域的值设置为其原值加新变量。其作用相当于

    window.document.first_form.the_textarea.value = window.document.first_form.the_textarea.value + word_with_return;

    目前我们已经学习了文字域和文字区域（值）的属性，接下来我们学习文字域和文字区域处理所用的方法：blur()、focus()和select()。

    下面的链接显示了focus() 和select()如何工作。注意他们工作一次后可能会终止功能。

    以下为表单和链接的编码：

    <form name="method_form">
        <input type="text" name="method_text" size=40 value="Hey, hey, we're the monkeys">
    </form>

    <a href="#" onMouseOver="window.document.method_form.method_text.focus();">Mouseover to focus</a>
    <a href="#" onMouseOver="window.document.method_form.method_text.select();">Mouseover to select</a>

    其使用方法和调用任何对象方法的做法是一样的：object_name.method(). 该文字域的名称是window.document.form_name.text_field_name，所以用下列语句就可调用文字域的focus()方法。 

    window.document.method_form.method_text.focus();

最新评论