if(parseInt(num) != ‘NaN’){}、とかやってたおろかな自分への戒めも。
if(isNaN(parseInt(num))){
// 処理
}
ですよねー。そりゃ関数あるよねー。
【Javascript】NaN（Not a Number）の判定方法。
【jQuery】特定の要素が画面内にレンダリングされた際、処理を実行する。
ブログなどの画面をスクロールしていると、読み終わるころにぴょこっと右下からお勧め記事が出てきたりする際にやってるやーつー。
いたって実装は単純。
$(function(){
// 処理実行の引き金となる要素を設定
var target = $("#target");
$(window).scroll(function(){
// 実行のトリガーになる要素のオフセット（一番上からの距離）から
// 画面の縦幅を引いたものを処理実行までの距離とする（画面の下端を基準に設定）
var tPos = $(target).offset().top - $(window).height();
// スクロールされた長さが上記で求めた距離を越えた場合、処理を実行
if ($(window).scrollTop() >= tPos) {
// 処理を記述
}
});
});
以下関数の解説。
■scroll()
画面のスクロールをトリガーに処理を実行する。
■offset()
指定した要素が可視状態の場合（display:noneとかじゃない）、ドキュメント内最上端から指定要素上端までの距離を取得する。
■height()
指定した要素の高さを取得する。$(window).height()の場合、現在の表示領域（画面の高さ）を返却する。
■scrollTop()
ドキュメントの最上端から現在までにスクロールされた距離をピクセルで返却する。
これらの関数を用いれば、ユーザー操作に連動したダイナミックな処理を簡単に実装することが出来る。
例えばフッターをターゲット要素に設定した場合、自動で次ページを取得しDOMに追加するといった、オートページャー的処理も簡単に行えちゃうのである。
【CSS】単語の途中でも強制改行させる方法。
デザイン的にどうしても要素からはみ出してほしくないとき用。
あと、長い英数字を連続して入力されたりしたときの対策。
div {
/* 幅の指定は必須 */
width: 250px;
word-wrap: break-word;
}
幅は指定しなければ意味がないので注意。
幅が定義されていないと強制改行もなにもないので。
※spanだとうまくいかない。pだとうまくいく模様。
【PHP】変数とその値から配列を作成する。
変数名をキーに、その値をバリューとして配列を生成する方法。
早い話がextract()の間逆の動作をさせたい場合。
// 以下のような変数があったとする
$param1 = 'hoge';
$param2 = 'piyo';
$param3 = 'fuga';
// compact()には配列形式にまとめた変数名リストで渡すこともできる
$multi = array('param2', 'param3');
// 変数名を指定してやることで配列キーとバリューに突っ込んでくれる
$array = compact('param1', $multi);
var_dump($array);
↓
array(3) {
["param1"]=>
string(4) "hoge"
["param2"]=>
string(4) "piyo"
["param3"]=>
string(4) "fuga"
}
extract()と同様、スマートな記述にはもってこいである。
【Excel】CSVファイルにて「”」をエスケープする方法。
嵌ったのでメモ。
変なところで詰まらないための基本ルールメモ。
1, 基本的に文字列の先頭と末端は「”」で囲う。
※本文中に「,」が混入しても区切り文字ではなく文字列として扱うため。
2, 本文中にメタ文字でない「”」が混入した場合は「”」の前にもう一つ「”」をつけてエスケープしてやる事。
※本文中に「”」を含めたければ「””」、「””」であれば「””””」とする。
これでもう嵌ることは無いはず。
I neither refuse who comes nor go after who leaves.
来るもの拒まず、去るもの追わず。
【jQuery】無の状態から特定のページに値をポストする方法。
例えばフォームタグの設置場所に困ったとき。DOMの文法的に配置するのを躊躇してしまうとき。めんどくさいとき←。
そんなときに超絶便利で素敵なポスト方法。
例えば以下のようなボタンをトリガーにしてポストを行う場合。
<button id="button">submit now</button>
jQuery側では以下のようにしてやる。
$(function(){
$('#button').click(function(){
// POSTしたいページを指定
var post = './';
var form = $('<form>', {'action':post, 'method':'POST'});
var input1 = $('<input>', {'type':'hidden', 'name':'n1', 'value':'v1'});
var input2 = $('<input>', {'type':'hidden', 'name':'n2', 'value':'v2'});
var input3 = $('<input>', {'type':'hidden', 'name':'n3', 'value':'v3'});
$('body').append($(form).append(input1).append(input2).append(input3));
$(form).submit();
})
})
これは何をしているのか。至って簡単。
その場でフォームを生成→bodyにアペンド→サブミット→完了。
inputタグ内のvalueは適宜jQueryで集めてきてやればよい。そして集めた分だけformタグ内にぶち込んでターゲットページにぶん投げればよいのである。
jQuery最強伝説。
【jQuery】セレクタにHTMLタグを渡すと、その要素を内部で生成してくれる。
という自分的大発見！
こいつはいったい何を言っているんだ？と言わずにまぁ落ち着いて。
例えば。
$(function(){
var elem = $('<div>');
$('body').append(elem);
})
2行目でやってることが、タイトルで言ったまんまの操作。jQueryのセレクタ指定部分にタグを渡している。
すると変数elemには内部的に「<div></div>」を保持していることと同等になる。
なので3行目でbodyに対してappend()を行うと、そのままbodyタグ内に上記のdiv要素がそのまま挿入されることになるのである。これは近年まれに見る世紀の大発見。
しかも第2引数にオブジェクトを渡すことでアトリビュートの設定も出来てしまうという神仕様。
$(function(){
var elem = $('<div>', {'id':'hoge', 'class':'piyo', 'data-foo':'fuga'});
$('body').append(elem);
})
例えば上記のようにオブジェクトを渡してやった場合、変数elemは内部的に以下のHTMLを生成してくれている。
<div id="hoge" class="piyo" data-foo="fuga"></div>
素晴らし過ぎるjQuery。これはもうやめられない。止まらない。
かっぱえｂ（ｒｙ