一番簡単な例をお目にかけます。
これより簡単な方法はありません。
では、先ず初めに、
下のボタンをクリックしてください。
コードはこんな風になってます。
<input onClick="document.location='next.html'"
type="button" value="ボタン">
最も簡単な <input> タグの使い方を、次に示します。
この長いボタンは次のコードで作られています。
<input type="button"
value="クリックしても何もしないボタン">
上のコードの中の type="button" を type="radio" にすると、
次のようなボタンになります。
このボタンは下のコードで作られています。
<input type="radio"
value="クリックしても何もしないボタン">
この場合には、value= を使って、何かを書いたとしても、無視されます。
しかし、上の例では、ちっとも面白みがないので、何かさせることにします。下のラジオボタンをクリックしてください。
このボタンは次のコードで出来上がっています。
<input onClick="alert('このボタンをクリックしても、このメッセージを出すだけです。')"
type="radio" value="ボタン">
このボタンをクリックした時に何かさせるために、onClick というイベント・ハンドラーと呼ばれるものを使います。
この例では、もし、あなたがこのボタンをクリックすると、ジャバスクリプト・エンジンが
alertという出来合いのメソッド （ファンクションとも呼ばれます） を実行します。何をするかというと、すでにクリックしたと思いますが、
ご覧のようにメッセージを表示します。
このalertについて、もっと知りたい場合は、このページ
(Javascript Special Characters and Alert() Method
)
を見てください。新しいウィンドーが開きます。
このページのトップで示した例は、このalert()の代わりに下のコードが書かれているわけです。
document.location='next.html'
このdocumentというのは、今あなたが見ているページのことです。location
というのは、ページが保存されている、あたなのコンピューターのディスプレー・メモリーの特定の場所です。従って、
document.location とは、「今あなたが見ているページが保存されている、
コンピューターのディスプレー・メモリーの特定の場所」ということになります。
その場所に、このページが保存されているわけで、それを今あなたは見ているわけです。
では、document.location='next.html'はブラウザーにとって、どういう命令かというと、
next.htmlというページを、「今画面に映っているページの保存場所に移しなさい」という意味です。
従って、あなたが、上のボタンをクリックすると、
ジャバスクリプト・エンジンがあなたのブラウザーに指令を出してnext.htmlというページを
今あなたが見ているページの保存場所へ移します。つまり、新しいページが画面に映し出されるわけです。
イベント・ハンドラーについてもっと知りたい場合には、このページ (イベント・ハンドラーってどうやって使うの？) を読んでください。
<input> タグは普通 <form>タグの中で使われます。
<input> タグも含めて、<form>タグについて、
もっと知りたい場合には、このページ (FORM Tag Made Easy!) を見てください。
Beaverland Music
Related
