テキスト・オブジェクト

text オブジェクトは、短数行のテキスト入力を受け付けることができます。このオブジェクトのメソッドとプロパティには以下のようなものがあります。これらは、他のテキスト・オブジェクトにも共通して定義されています(一部例外あり）。

members
プロパティ	name	... name 属性の取得・設定
	id	... id 属性の取得・設定
	type	... type 属性の取得
	value	... value 属性（表示文字列）の取得・設定
	defaultValue	... 初期表示文字列の取得・設定（file は除外）
メソッド	focus()	... focus イベントを発生させる
	blur()	... blur イベントを発生させる
	select()	... select イベントを発生させる

　上記中、id, type, value はタグにおける属性を表現します。ただし、テキスト・オブジェクトでは、value プロパティは表示文字列となります。また、focus / blur メソッドでフォーカスの設定と解除、select メソッドで表示文字列を選択状態にすることができます。
　下記のサンプルでは、表示ボタンを押すと文字列を表示し、選択ボタンを押すと二つのテキストを交互に選択状態にします。

// JavaScriptソース
document.Form1.Text1A.defaultValue = "Text オブジェクトは、";
document.Form1.Text1B.defaultValue = "一行テキストを受け付けます。";
var bFocused = true;

function Button1_Click() {
    if (bFocused) {
        document.Form1.Text1A.select();
    } else {
        document.Form1.Text1B.select();
    }
    bFocused = !bFocused;
}

<!-- HTMLソース -->
<form name="Form1" style="margin:1ex;">
    <input type="text" name="Text1A" size="32"/>
    <input type="text" name="Text1B" size="32"/>
    <input type="reset" value="表示" />
    <input type="button" name="Button1" value="選択" onclick="Button1_Click()"/>
</form>

textarea オブジェクトは複数行のテキストを受け付けます。文字列を設定する際、改行にはエスケープ文字 '\n' を使用します。また、ブラウザによって、defaultValue プロパティが正常に動作しないブラウザがありますので注意が必要です。ちなみに、textarea オブジェクトは、親オブジェクトのフォントサイズを継承しないブラウザもあるので、タグ内で再設定しておくことをおすすめします。
　下記のサンプルは、表示ボタンで改行つきの文字列を表示し、選択ボタンで表示文字列を選択、クリアボタンで文字列を消去します。

// JavaScriptソース
var str = "Textarea は、\n複数行のテキストを\n表示するオブジェクトです。";

function Button2A_Click() { document.Form2.Text2.value = str; }

function Button2B_Click() { document.Form2.Text2.select(); }

function Button2C_Click() { document.Form2.Text2.value = ""; }

<!-- HTMLソース -->
<form name="Form2" style="margin:1ex;">
    <textarea name="Text2" cols="30" rows="3" style="font-size:100%;"></textarea>
    <input type="button" name="Button2A" value="表示" onclick="Button2A_Click()"/>
    <input type="button" name="Button2B" value="選択" onclick="Button2B_Click()"/>
    <input type="button" name="Button2C" value="クリア" onclick="Button2C_Click()"/>
</form>

password オブジェクトでは、入力した文字が特定の記号と成って表示されます。記号はブラウザにより異なりますが、いずれも value プロパティで正確な入力文字を取得することができます。
　以下のサンプルは、パスワード "guest" を入力すると "OK" 、それ以外は "Wrong" の文字をダイアログで表示して、間違った文字列を選択状態にします。 また、未入力の時はメッセージを表示してフォーカスをオブジェクトに設定しています。

// JavaScriptソース
var sPW = "guest";

function CheckPW() {
    var sInput = document.Form3.PW3.value;
    if (sInput == "") {
        alert("Empty !");
        document.Form3.PW3.focus();
    } else if (sInput == sPW) {
        alert("OK !");
    } else {
        alert("Wrong !");
        document.Form3.PW3.select();
    }
}

<!-- HTMLソース -->
<form name="Form3" style="margin:1ex;">
    <input type="password" name="PW3" value="" size="8"/>
    <input type="button" value="チェック" onclick="CheckPW()"/>
</form>

file オブジェクトは、ファイル名を表示するテキスト部と、ファイルを指定するダイアログボックスを開くためのボタン部分からなります。ダイアログボックスの外観は、通常は OS によって異なります。また、file オブジェクトでは defaultValue プロパティは使用できません。value プロパティも表示できないブラウザがあるので注意が必要です。
　下記のサンプルでは、確認ボタンを押すと、value プロパティの値を取得してダイアログに表示します。

// JavaScriptソース
function Button4_Click() {
    if (document.Form4.File4.value == "") {
        alert("何も入力されていません。");
        document.Form4.File4.focus();
    } else {
        alert(document.Form4.File4.value);
    }
}

<!-- HTMLソース -->
<form name="Form4" style="margin:1ex;">
    <input type="file" name="File4" size="60"/>
    <input type="button" name="Button4" value="確認" onclick="Button4_Click()"/>
</form>