JavaScript

JavaScript

JavaScript入門の教科書「変数とは何か?」

変数とは? JavaScriptの変数は、前もって数値やデータを入れておく場所のことで、メモリ空間とも呼ばれます。 数学ではxやyが代表的な変数として、中学校以降学んだと思います。 変数を使うには「宣言」する必要がある JavaScriptで変数を使う場合、先にこれが変数だよ、とパソコンに教える必要があります。 これを「宣言」と呼びます。 宣言の仕方は次の通り、var に続けて変数名を書きます。

ちなみに、varは”variable”(変数)の略語です。 では実際に変数を宣言してみましょう。

上記では4種類の変数を宣言したところです。 変数にあらかじめデータを入れておくこともできる 先ほどの var 変数名; は変数を宣言したところですが、それと同時に 数値や文字などのデータを入れておくこともできます。

ここで、名前にはクォーテーションマークがついていて、年齢にはついていませんが 詳しくは別のテーマで取り上げたいと思います。 ここで使った = (イコール記号)が「代入」を意味します。 数学のイコール(等しい)とは違う意味なので注意!! つまり var name =’太郎’; の場合は、 nameという変数を宣言し、そこに「太郎」というデータ(文字)を代入する。 変数に代入された最初の値を「初期値」といいます。 逆に、 var name; のように、変数のみ宣言され、値が代入されていないものを「未定義値(undefined)」といいます。 1行にまとめて変数を宣言することもできる 先ほどの変数宣言の例では4つの変数を4行にそれぞれ書きましたが、 まとめて1行で書くこともできます。

カンマ(,)を使って、それぞれの変数名を記載します。 変数の名前のつけ方ルール var 変数名; の変数名は、ほとんどの場合、好きな名前をつけることができますが、 少しだけルールがあるので紹介します。 ●ルール1 使える文字は次の通り 英字、数字、アンダースコア(_)、ドル記号($) ●ルール2 変数名は数字から始めてはいけない ●ルール3 予約語を使用してはいけない 予約語を変数名の一部に含めることは可能 ●ルール4 大文字・小文字は区別され、別の名前とみなされる 変数名のつけ方は基本自由だからといって、 var […]

JavaScript

【jQuery】チェックボックスで「該当なし」を選択肢たらその他を非表示

今回は、チェックボックスで「該当なし」をチェックしたときに、他の選択肢は選択できないよう、非表示にするプログラムをjQueryを使って作成します。 動作 最終的にこんな感じで動きます。 //codepen.io/creativeflake/pen/qrMMmx HTML HTMLは、シンプルなリスト構造で作成するとして、input type=”checkbox” には「name」属性、「value」属性を記述します。 *もちろん、リスト以外でもOKです。 ここでクラス名を”check_multi”というものと、「該当なし」の場合は”check_unique”とします。

CSS CSSの .disabled はjQueryによって追加されるクラス名になるのですが、非表示となった場合、透過度を40%になるということを、あらかじめ設定しておきます。

JavaScript 前提条件として、head内でjQueryを読み込みます。 JavaScript本体は次のように記述します。

JavaScriptの解説 1行目 inputタグが変更されたら(チェックのオン・オフ)があった場合、以下の関数を実行します。 2行目 クラス名”check_unique”がチェックされていたら 3行目 クラス名”check_multi”を非表示(disabledをオンにする)にし、 4行目 クラス名”check_multi”のチェックを外し(checkedをオフにする)にし、 5行目 クラス名”check_multi”の親要素にクラス名”disabled”を付け加えます。 7行目 それ以外(クラス名”check_unique”がチェックされていない)とき 8行目 クラス名”check_multi”を表示(disabledをオフにする)にし、 9行目 クラス名”check_multi”の親要素からクラス名”disabled”を外します。 動作 こちらから改めて動作を確認してみてください! //codepen.io/creativeflake/pen/qrMMmx

JavaScript

任意の整数で乱数を作る[JavaScript]

JavaScriptで乱数を発生させる JavaScriptで乱数を発生させるには、Mathオブジェクトのrandomメソッドを使います。 Math.ramdom() では、0から0.9999…までの間の任意の乱数を「小数で」作ります。 乱数の範囲を広げる (例)0〜9.9999…までの乱数を作りたい場合 Math.ramdom() * 10 (例)0〜15.9999…までの乱数を作りたい場合 Math.ramdom() * 16 (例)0〜122.9999…までの乱数を作りたい場合 Math.ramdom() * 123 つまり、” Math.random() * 乱数の範囲 “ が公式です。 整数の乱数を発生させるには 整数の乱数を作りたい場合は、Math.floor を使って、小数以下を切り捨てる方法があります。 (例)0〜9までの乱数を作りたい場合 Math.floor(Math.ramdom() * 10) (例)0〜15までの乱数を作りたい場合 Math.floor(Math.ramdom() * 16) ここでも、” Math.floor(Math.random() * 乱数の範囲) “ が公式です。 任意の整数で乱数を作る (例)5〜14までの乱数を作りたい場合 Math.floor(Math.ramdom() * 10) + 5 (0〜9の乱数に、5を加える) (例)10〜100までの乱数を作りたい場合 Math.floor(Math.ramdom() * 91) + 10 (0〜90の乱数に、10を加える) […]