MW211 EXIT

devlog
JavaScript/ゼロパディング
2012年02月06日
例えば、「1」を「001」と3桁固定で表示するために、
先頭に「0」を埋めるようなことを、「ゼロパディング」という。

Excelの関数で以下のような感じで実現できる。
┌──────────────────────────────────────┐
│=TEXT(1,"000")                                                              │
└──────────────────────────────────────┘

CやPHPだとこんな感じなる。
┌──────────────────────────────────────┐
│sprintf("%3d", 1)                                                           │
└──────────────────────────────────────┘

では、JavaScriptでは?

まず、ベタな方法。
┌──────────────────────────────────────┐
│var a = 1;                                                                  │
│if (a < 100) {a = "0" + a;}                                                 │
│if (a < 10)  {a = "0" + a;}                                                 │
└──────────────────────────────────────┘
ただ、これだとif文を羅列しなきゃならない。

ちなみに数値以外にも対応したい場合は、こうか。
┌──────────────────────────────────────┐
│var a = 1;                                                                  │
│switch (a.length) {                                                         │
│  case  1: a = "00" + a;                                                    │
│  case  2: a = "0"  + a;                                                    │
│}                                                                           │
└──────────────────────────────────────┘

ただし、一番シンプルなのは以下だろう。
┌──────────────────────────────────────┐
│var a = 1;                                                                  │
│a = ("00" + a).slice(-3);                                                   │
└──────────────────────────────────────┘
これは使える。
分類:JavaScript
JavaScript/配列に追加
2012年02月05日
PHPにおいて配列の最後に追加するには、以下のような感じに記述する。
┌──────────────────────────────────────┐
│$配列[] = 値;                                                               │
└──────────────────────────────────────┘

これをJavaScriptにあてはめると、以下のような感じになる。
┌──────────────────────────────────────┐
│配列.push(値);                                                              │
└──────────────────────────────────────┘
「配列[] = 値;」とはできないので注意。
分類:JavaScript
HTML/ファイルアップロードのタグ
2012年02月04日
┌──────────────────────────────────────┐
│<input type="file"/>                                                        │
└──────────────────────────────────────┘
ファイルをアップロードすることができるこのタグ。

でも、ブラウザによって見え方が違う。
以下のような感じ。
┌─────────┬───────────────────┐
│                  │┌────────────┐┌───┐│
│Internet Explorer ││                        ││参照..││
│                  │└────────────┘└───┘│
├─────────┼───────────────────┤
│                  │┌────────────┐┌───┐│
│Firefox           ││                        ││参照..││
│                  │└────────────┘└───┘│
├─────────┼───────────────────┤
│                  │┌───────┐                    │
│Chrome(Google)    ││ファイルを選択│選択されていません  │
│                  │└───────┘                    │
├─────────┼───────────────────┤
│                  │┌───────┐                    │
│Safari(Apple)     ││ファイルを選択│ファイルが未選択です│
│                  │└───────┘                    │
├─────────┼───────────────────┤
│                  │┌────────────┐┌───┐│
│Opera             ││                        ││選択..││
│                  │└────────────┘└───┘│
└─────────┴───────────────────┘

注意したいのは、Chomeなどの場合の右端。
若干隙間が空いてしまうのだ。
┌──────────────────────────────────────┐
│┌───────┐                        ┌──┐                          │
││ファイルを選択│選択されていません      │確定│                          │
│└───────┘                        └──┘                          │
└──────────────────────────────────────┘
もしも、確定ボタンとかを横に置いた場合には、一体感に欠けてしまう。

そんな時は以下のように背景色をつけてあげれば、右端の余白も塗ってくれるので、
隣接している感が復活する。
┌──────────────────────────────────────┐
│<input type="file" style="background-color:#CCCCCC;"/>                      │
└──────────────────────────────────────┘

ちなみに、最近のIEの背景色のdefaultは灰色みたいです。
分類:HTML
前へ 1 2 3 次へ