JavaScript

iframeを無視してリダイレクトしたい

iframeで呼ばれているページ内で、PHPでリダイレクトを行う場合、target="_top"みたいな設定が出来ないっぽい。 なので一旦以下のソースの様なページにリダイレクトし、そこからJS経由でリダイレクト。 <html xmlns:og="http://ogp.me/ns#"> <head> </head></html>

エスケープ

//変数strをエスケープ str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/'/g, '&acute;').replace(/"/g, '&quot;').replace(/\\/g, '&yen;'); まぁ普段はescape()とかencodeURI()とかencodeURIComponent()を使えばいいよ。

後方参照?

やっつけで書いたのでベストかどうか分からない。 取り敢えず6個ある引数の5番目をぶっこ抜く。 var text = 'matrix(1, 2, 3, 4, 500, 6)'; text.match(/([0-9]{1,3}), ([0-9]{1,3}), ([0-9]{1,3}), ([0-9]{1,3}), ([0-9]{1,3}), ([0-9]{1,3})/); alert(RegE…

セレクトボックスで選択されている値を取得

よく忘れるのでメモ。 alert( document.getElementById("hoge").options[ document.getElementById("hoge").selectedIndex ].value );

onclickにSmartyから文字列を渡す場合のエスケープ処理

default_modifiersでhtmlを設定している場合 'quotes'だけでOK {~$tmp|escape:'quotes'~} default_modifiersでhtmlを設定していない場合 'quotes'→デフォルト('html')の二重 {~$tmp|escape:'quotes'|escape~} テストコード {~nocache~} <script type="text/javascript"> "); document…

JSでサブミットする場合の注意点

<a href="javascript:void(0)" onclick="fncSubmit();return false;">送信</a> 送信関数の実行後に「return falase」必須。 ないとIE6ではサブミットはされるのに、画面が遷移しなかったりする。

URLの#以降に?が含まれていた場合の挙動

通常、URLの#以降は以下のJSで取得できる。 対象URLが「http://hoge.jp/#fuga.php?id=piyo」の場合 alert( window.location.hash ); alert( window.location.hash.substring(1) ); 実行するとそれぞれ #fuga.php?id=piyo fuga.php?id=piyo と表示される。 …

URLを取得し、末尾の#をすべて取り除く

hoge = document.URL.replace( new RegExp( "#+$", "g" ), "" ); JavaScriptの正規表現は最長マッチがデフォらしい。 なので++ではなく+でOK。 ソースは忘れた。

URLにリンクを設定する。スクリーン名もあるよ

URL word = word.replace( new RegExp( "((?:https?|ftp)(?::\/\/[-_.!~*\'()a-zA-Z0-9;\/?:\@&=+\$,%#]+))", "g" ), "<a href=\"$1\">$1</a>" ); screen_name word = word.replace( new RegExp( "@([A-Za-z0-9_]{1,15} )", "g" ), "<a href=\"http://twitter.com/$1\">@$1</a> " );

公式サイトにハッシュタグを含む文章を渡すリンク

document.getElementById("hoge").href = "http://twitter.com/home?status="ぶんしょう!" + " " + hash_tag.replace("#", "%23"); シャープは置換しなさいってこった

JSONパース後のfor inにおけるブラウザ毎の挙動の違い

超ハマったのでメモ。 PHPで作られた配列。キーが降順なことに注目 c [1] => b [0] => a ) ↓ PHPのjson_encode()で配列をJSON化 {"2":"c","1":"b","0":"a"} ↓ JavaScriptでJSONをパースし、for inで回してキーをalert var json = eval({"2":"c","1":"b","0"…

DOMでテキストノードを挿入する

var textNode = document.createTextNode("ほげほげ"); ELEMENT.appendChild(textNode);

外部JavaScriptファイルから別の外部JavaScriptファイルをインクルードする方法

まずファイル構成。 /root ├index.html ├a.js └b.jsindex.htmlでa.jsとb.jsの両ファイルをインクルードする方法は <script type="text/javascript" language="JavaScript" src="a.js"></script> <script type="text/javascript" language="JavaScript" src="b.js"></script> が一般的です。 じゃあa.js内でb.jsをインクルードする方法は? 今のところ、JavaScriptにインクルード命令はありません。 しかしdoc…

GMEasy3リファレンス::簡単にGoogleマップを設置できるライブラリ

最終更新日 2010/02/02 バージョン 1.0.0 ライセンス MIT 割と簡単にGoogleマップを設置できるライブラリです。 マーカーも設置できます。 住所検索もできます。 座標や倍率も拾えます。 名前はGMEasy3です。 APIのバージョンが3なので、煩わしいAPIキー要ら…

要素の種類を調べる

alert( document.getElementById("hoge").nodeName ); テキストボックス等なら"INPUT"が、spanタグなら"SPAN"が返る。

createElement()でプルダウンボックス(セレクトボックス)を追加

var select = document.createElement("select"); var option_google = document.createElement("option"); var option_yahoo = document.createElement("option"); var option_baidu = document.createElement("option"); option_google.setAttribute("valu…

IE系ではsetAttributeでイベントハンドラを設定できない

idやname等は設定できるがイベントハンドラは無理みたい。 解決方法 if(IE系なら) { hogeElement.setAttribute("onclick", new Function( "o_hoge.hoge()" ) ); } else { hogeElement.setAttribute("onclick", "o_hoge.hoge()" ); } setAttributeの第二引数…

DOMでテーブルへテキストボックスを動的に追加

ない場合に削除したときのエラー処理は入れてない。 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>DOMでテーブルへテキストボックスを動的に追加</title> <script language="JavaScript" type="text/javascript"> </head></html>

テキストボックスにフォーカスがある時にエンターキーでイベントを起動

html側 <input type="text" onkeypress="hoge(event.keyCode);" /> JavaScript側 function hoge(code) { //エンターキー押下なら if(13 === code) { alert("エンターキーが押されたよ!"); } }

読み込むだけでスムーススクロールするjsを書いた

headタグ内でView_smoothScroll_compression.jsを読み込むだけで動作 他のライブラリを使用していないので、依存性がない アンカー先は<a name="hoge">だけでなく、<div id="hoge">等にも対応 nameとidで指定可能 hoge.html#の様な末尾#のアンカーはスムーススクロールしません 従来通りの</div></a>…

Ajax経由での検索システム作ったらエンターキー押下で検索できなかったでござるの巻

・テキストボックスと検索ボタンがある ・検索ボタン押下でテキストボックスの内容をAjaxでPHPに飛ばして検索 ・PHPが取得した検索結果をJavaScriptで表示 このような検索システムの場合、テキストボックスの内容をPOSTやGETで送信する必要がないので、form…

Firefoxでは予約語である「class」が変数名として使えてしまう

var class = "hoge"; 何の変哲もないJavaScriptのコードだけれど、classは予約語だったりする。 IE6・7とSafariはエラーになるんだけど、メインブラウザ兼開発に使用中のFirefox3.0.11では動いたからハマった。

指定桁で四捨五入

hoge = hoge.toFixed(2); //小数点2桁目以後を四捨五入

プルダウンボックスのvalue値がIEで取れない

<select id="hoge"> <option>1</option> <option>2</option> <option>3</option> </select> この様なプルダウンボックスに対して alert( document.getElementById("hoge").value ); を行うとFirefoxやSafariは1や2といった値をalertしてくれるが、IEではエラーになる。 きちんと <option value="1">1</option> とvalueを設定しましょう。 ハマった。 くやしい! 普段はち…

継承まとめ

スーパークラス var Super = function(num1) { this.num1 = num1; //※1 this.num2 = 20; this.alert_num1 = function() { alert(this.num1); } this.alert_num2 = function() { alert(this.num2); } } サブクラス var Sub = function(num1) { this.num1 = nu…

ieではtbodyやtrの内容をinnerHTMLで書き換えできない

ちょっとハマったので備忘録めもめも。 回避用のメソッドを自作ライブラリのWrapに追加した。 要望があれば公開します。

addEventListener()やattachEvent()のコールバック関数に引数を設定する方法

サンプルソース(抜粋) //ie以外 if(el.addEventListener) { el.addEventListener ( "focus", function() { eval( name + ".myOnfocus(y);" ); }, true ); el.addEventListener ( "blur", function() { eval( name + ".myOnblur(y);" ); }, true ); } //ie el…

textareaの文字数制限

textareaって入力文字数制限できなくて不便ッ! てことでJavaScript書きました。 多分車輪の再発明なのは気にしない。 .js function limitMaxLength(target, len, err) { if( target.value.length > len ) { target.value = target.value.substr(0, len); if…

複数のRSSを1つにまとめ、ソートして表示するサンプル

サイト上にRSSを表示する方法の一つとしてGoogle AJAX Feed APIは非常に簡単で便利ですが、複数のフィードを1つにまとめ、ソートして表示することはできません。 1つにまとめることはできるのですが、 サイトAのフィード サイトAの4/9の記事 サイトAの4/6の…

NaNか調べる

isNaN(hoge); NaNならtrue、そうでなければfalseを返す。