在宅プログラマーの備忘録として2005年に始めたブログです。
まずイベントハンドラの登録は
|
1 2 3 |
$(セレクタ).on('click',function() { // 処理 } |
という感じですが、
JavaScriptによってコンテンツを動的に増やせるようなページを作成しているときに
イベントハンドラの登録がどんどん重複されていくという問題がありました。
解決方法はいくつかありますが、そのとき一番簡単だった解決方法は
onの前にoffを呼ぶ
でした。
|
1 2 3 4 |
$(セレクタ).off('click'); $(セレクタ).on('click',function() { // 処理 } |
これだけですが、期限に追われ余裕がないときは
なかなか気が付かないものですね。
年間会員の仕組みを作っていて
会員の有効期間をデータベースに登録するとします。
データベース登録後に送信するメールにも有効期間を記載するため、
SQLではなくPHPで開始日と終了日を求めることになりました。
PHPの日付関数で年間会員の開始日と終了日を計算します。
開始日は当日ではなく、当月の1日とします。これは簡単ですね。
|
1 |
date('Y-m-01'); |
終了日は1年後の前月の最終日、たとえば2017年4月15日に入会した場合の終了日は
2018年3月31日
になります。
このとき、単純に今日の日付をもとに計算してしまうと、
月末の31日などに入会した際に前後の月が30日までしかないことにより、結果がおかしくなってしまいます。
ですので、必ず「1日」を基準に計算するようにします。
|
1 |
date('Y-m-d', strtotime(date('Y-m-01', strtotime(date('Y-m-01') . '+1 year')) . '-1 day')); |
長いですね。無駄がありそうな気がしないでもないですが。
CSSで指定できるカーソル形状で、よく使われるものをリストアップしました。
文字にカーソルを合わせるとカーソル形状が変化します。
よくあるsubmitフォームの場合、
エンターキーを押すと自動的にsubmitされるようになっています。
これをformタグがないただの入力フォーム上で、
エンターキーが押されたら処理を行うようにします。
|
1 2 3 4 5 |
$(入力フォーム).keypress(function(e) { if(e.which == 13) { /* 処理内容 */ } }); |
縦方向の表示位置を整えてくれるスタイル「vertical-align」ですが、
横方向の「text-align」と比べて使用できる条件は限られています。
まずvertical-alignが使用できるのは
・インライン要素
・テーブル要素
のみです。divタグやpタグに、ただvertical-alignを指定しただけでは反映されません。
反映させるにはテーブル要素にしてしまいます。
|
1 |
display: table-cell; |
それと、縦方向のサイズが指定されていなかったり、％で指定されていたりしても反映されません。
具体的なサイズで指定します。
|
1 |
height: 200px; |