[JavaScript]


この日記のはてなブックマーク数 このエントリーを含むはてなブックマーク


サンプルはこちらです

[JavaScript部分]

<script type = "text/javascript">
<!--
function functionName()
{
var select1 = document.forms.formName.selectName1; //変数select1を宣言
var select2 = document.forms.formName.selectName2; //変数select2を宣言

select2.options.length = 0; // 選択肢の数がそれぞれに異なる場合、これが重要

if (select1.options[select1.selectedIndex].value == "果物")
{
select2.options[0] = new Option("りんご");
select2.options[1] = new Option("みかん");
select2.options[2] = new Option("オレンジ");
}

else if (select1.options[select1.selectedIndex].value == "野菜")
{
select2.options[0] = new Option("キャベツ");
select2.options[1] = new Option("きゅうり");
select2.options[2] = new Option("にんんじん");
select2.options[3] = new Option("たまねぎ");
}

else if (select1.options[select1.selectedIndex].value == "肉類")
{
select2.options[0] = new Option("豚肉");
select2.options[1] = new Option("牛肉");
}
}
//-->
</script>


[HTML部分]
<body bgcolor onLoad="functionName()">
<form name="formName" method="post" action="./pathToProgramFile">

<!--選択肢その1-->
<select name = "selectName1" onChange="functionName()">
<option value = "果物">くだもの</option>
<option value = "野菜">やさい</option>
<option value = "肉類">にくるい</option>
</select>

<!--選択肢その2(選択肢その1の項目によって変化)-->
<select name = "selectName2">
</select>

</body>

なお上記の例ではプログラムに渡される値は表示されている値となります。表示の値とプログラムに渡る値を別にするには以下のようにすればよい。 new Option("りんご","りんごの値");

広告
JavaScript 第5版 JavaScript 第5版
¥ 4,410 / 売り上げランク: 2182 / 704 ページ

翻訳が非常に上手です。読んでいてストレスを感じません。様々な応用テクニックが載っているのでかなりのボリュームですが、サンプルをコピペしてすぐにWebサイトが華やかになる、という内容では無いです。手軽に扱えるスクリプト的なイメージが強いjavascriptですが、本書では本格的なプログラム言語としての位置づけです。"控えめなjavascript"という方向性に共感できる方にお勧めできます。

DOM Scripting 標準ガイドブック ~やさしく学ぶ、JavaScriptとDOMによるWebデザイン~ (Web Designing BOOKS) DOM Scripting 標準ガイドブック ~やさしく学ぶ、JavaScriptとDOMによるWebデザイン~ (Web Designing BOOKS)
¥ 3,045 / 売り上げランク: 9229 / 352 ページ

DOMって何?という人から、我流でDOMを覚えて非標準なDOMを使っている人向けの本。

この本は、リファレンスでもなく、応用実例集でもありません。
非常にわかりやすい教科書です。
HTMLとJavaScriptの連携方法が、丁寧に解説されています。ソースコードもとてもきれいでわかりやすいです。

『「OFF環境に優しい」かをチェックする』や『JavaScriptが出しゃばっていないか』というあたりは大変参考になりました。

標準化されたDOMを勉強したい人にとっては、最高の書物だと思います。

jQueryで作る Ajaxアプリケーション jQueryで作る Ajaxアプリケーション
¥ 2,919 / 売り上げランク: 17922 / 336 ページ

jQueryに特化しているので、内容がすごく分かりやすい。
jQueryを使うことで、こんなにもスクリプトが簡潔に書くことが
できるのかと改めて実感。

初心者が理解に苦しむ要素の指定も、例を挙げながら前半部分で
理解しながらすすめることができる。

図や処理順序もとてもわかりやすいので、jQueryだけでなく、
プログラミングに興味を持つのにはいい教材になりそうな良書。