そこでご紹介したいのが、こちらのサイトさん

Javascriptを使って、静的HTMLの中でファイルをインクルードするソースを公開されています。

使い方は簡単。上記のサイトにある関数を記述したjsファイルを作成するなりHTML内に書くなりして、あとは必要な部分で関数を呼び出すだけ。

たったこれだけです。ヘッダーとかフッターとか、全ページで共通して表示させるような部分をこれで外部ファイルにしておけば、静的ページの作成も楽になりますね。

今までは、共通部分を一ヶ所直すたびに全ファイルを直すとかいう効率の悪いことをしてたんですけど、今度からはこれで行かせていただこうとを思います。

むしろもっと早くに調べとくんだったよ……バカ。

注：ブラウザによっては動かない場合もあるっぽいです。僕の使ってるOperaでは動かなかった。他にもformが動かないなどの報告もあるみたいなので、運用レベルでの使用ではなく、モックの作成などに活用するのが良いかもしれません。

あるいはこのソースを改良して動くようにするとか、でしょうか。

違いと言うか二つとも可視的にファイル転送が出来るソフトなのはご周知の事実ですよね。

もの凄くざっくり言うとSSH通信が出来るかどうかが決定的な違い。

使うサーバの設定によって使い分けてるんですね。

次はTeraTerm

TeraTermはtelnetクライアントソフトの一つって事か。仲間ってことかな。成程。

UNIXコマンドが使えたらTeraTermを使った方が作業が楽そうと思われ。

今回は直にファイルを編集しないでsqlの結果見ましたが機会があったら挑戦してみよっと。

そしてテストをさせて頂いてて聞いた話ですが

IE6でjavascriptが動かない。成程サーチ！

してみると

だと動かない。ので

とfalseを記入すると動く。らしい。

この要素が原因だと嬉しい。

自分の現在地から見ての情報の取得を調べていたらこんな感じのを・・

うーん。でも違うぞ・・

自分自身の経度と緯度を取得してそこから何件か付近のデータを取得したい。

テストあるのみですね。

lightbox.jsの

焦りはいけないですね；；
もう少し落ち着いて出来るようになりたいです；；

まあ、何てことない普通の配列なのですが、注目してほしいのは、5の後ろにあるコンマ。

ここにコンマがあると、ブラウザによって配列の要素数が変わって来るようなのです。

実際にこの要素数をアラートしてみれば分かるのですが

上記の場合、FirefoxやOperaだと結果は5が返ってきます。

しかし、IEだと6が返って来るようです。

コンマの後に何もなくても、要素数をカウントしてしまうみたいですね、IEだと。

仕事ではないんですが、ちょっとjQueryのライブラリを使ってお遊びでサイトを作ったりなんかしていまして……で、どうしてもIEでだけjavascriptが思うように動作してくれなくてですね……何でかなぁと3か月くらいずっと悩んでいたんです。

IEだから仕方ないかなとか、IEが悪いに違いない、IEなんて死ねば良いんだとか、ひたすらIEに責任をなすりつけてこれは正常な動きはできないものなんだ、俺のせいじゃないとずっと目を逸らして来たんですが、現実と向き合ってみたら、問題はこのコンマにあったみたいです。

PHPと組み合わせて、foreachで回して配列に値を入れていたせいで、最後のコンマが余分だったことにうっかり気づかなかったのが敗因でしたね。

何かこんな感じの配列を作ってたわけっすよ。当然最後に不要なコンマが入ってしまいますね、これだと。

そこを修正したら、IEでも他のブラウザと同じような動作をしてくれるようになりました。やったね★

まあ、IEが悪いと言えば悪いような、俺が悪いと言えば悪いような……？　そんな感じ？

このとき、return falseをつけておかないと、リンクをクリックしてアラートが出た後に、アンカーの移動（で合ってる？）みたいなのが行われてしまう。URLの最後に＃がつく感じですね。

ここを＃にしないでjavascript:void(0)と書くと、return falseがなくても大丈夫なのかな……自分で確かめた限りでは大丈夫だったけど、参考文献をいくつかあさった限りでは、javascript:void(0)でも完全なリンクの無効にはならないっぽいことも書いてあった。まあどっちの場合でもreturn falseを書いとけばまず間違いはないだろうと思われます。

僕も基本的には常にreturn falseを書いてます。まあ僕の場合は、return falseの意味をちゃんと理解してたわけじゃなくて、初めてjavascriptを触ったときに、とりあえず後ろにはreturn falseをつけるのが常識なんだろうみたいな印象を持って以降、今でもそのままの流れでとりあえずつけとけばいいやって思って書いてる感じですけど。

でもそんな覚え方だと、やっぱり落とし穴の一つや二つにははまるわけですね。

この前、ラジオボタンにonchange属性をつける仕様があったんですけど、当然のようにreturn falseをつけて書いてたら、チェックの変更が起きなくなってしまったんですね。

だいぶ適当に書きましたけど、例えばこんな感じのラジオボタンがあったとして、最初にラジオ１の方を選択してそっちにチェックがついたら、何度ラジオ２の方のボタンを押してもチェックはラジオ１の方についたままになってたんですよ。何か言葉だけで説明するとややこしいっすかね……すんません。

ちなみに、function test()はちゃんと呼ばれます。だからthis.valueをアラートしてみると、ちゃんと選択された方の値は取得できるんですよ。でもチェックの移動はしない。function内で無理やりチェックを変えるとかも試みてみたんですけど、ダメでした。僕の書き方に問題があった可能性はここでは無視することにして、とりあえずダメでした。しつこいようですが、ダメでした。

ダメでした。

で、その原因がreturn falseでした。こいつを外したら、正常な動きをするようになった。

何かねぇ……ラジオボタンにonchangeって、なかなかの曲者っぽい感じがします。Firefoxではちゃんと動くのにIEだとちゃんと動かなかったりとか。っていうか、IE6だとちゃんと動かなかったりとか。

この前もね、先方さんから「何かラジオボタンのとこが上手く動かないんだけど」みたいなこと言われて、こっちでいろいろチェックしてみたんですけど、どこにも不具合が見つからなくて、まさかと思ってIE6でテストしてみたら、まさにズバリだったさ。

くそっ、IE6め。IE6めぇぇぇぇ！！

先日、Ajaxで処理を行う場面に出くわしたときにこのsubmit()を使ったのだけど、とあるページでだけエラーが起きた。

こんな感じのエラー。あ、document.get～が$になってるのはprototype.jsを使用してるからね。

いくつかのページで同様の処理を行っていたのだけど、一つのページでだけこのエラーが出て、どうにも先に進まなかった。

で、調べた結果たどり着いたのがこちら

＞どうやらidやname属性が “submit” になってる部品があると、JavaScriptのFormオブジェクトのsubmit()が上書きされる模様。

ということなんだそうです。

ああ、言われてみれば確かに。CakePHPでsubmitボタンの種類別の判定をしようとして、$this->params['form']['submit']に値を入れるために、submitボタンにsubmitっていうname属性をつけていました。

確認画面を挟んだ処理とかのときにね、この値をswitch文とかで判定しようと思ってやったことだったんだけど、まさかそれがこんなところに影響を及ぼすとは、思いもよりませんでした。まあ、分かってしまえば解決方法は至って簡単。name属性を別のに変えれば良い。

上記の参考サイトさんには、これは当たり前すぎる的なことを書いてあるんですが……そーだったんですか。

でもそういう当たり前のことに気づかないことだって、たまにはあるよね。人間だもの。
（僕の場合は気づかなかったんじゃなくて知らなかっただけですけど……）

そんなときはjavascriptで先に画像を読み込んでおくという手もあるっぽい。

こんな感じ。

できればこの処理が並列で行われると良いのだが、現状はSafariやIE8でしか並列処理は実装されていないらしい。そのうち段々と実装されていくらしいけど。

とりえあず、全体的に実装されるまでは何らかの対策を講じようというわけで、その何らかの対策についてですけれど、javascriptを動的にロードすることで、並列処理を可能にする方法がある。

通常、javascriptファイルを読み込む場合は

headタグの中に↑こんな感じで記述するけれど、これ自体をjavascriptで行うことで、動的な読み込みが可能になる。

同様にcssもこの方法で読み込むことも可能っぽい。

参照サイトはこちら。実際に並列処理している様子が分かるますです。

で、今回それを逆にできないかなって思ったわけですよ。仕様的にそういう要求をされているのかをいまいち掴みかねた部分もあるんですけど、編集画面で改行を1行だけにしてほしい的なことを言われたので、たぶんそんな感じのことを言ってると思ったわけですよ。別に現状で問題なければ、わざわざそんな要求をしてこないと思うし。そう思ったわけですよ。

プラグインとかをいろいろ調べてみたんですけど、自分が調べた限りでは、記事投稿の際にpタグやbrタグを挿入しないプラグインは存在するんですが、それだと本文にも改行が入らないようになってしまうので、もっと別のやり方を考えないといけない。

僕も詳しいことは分かっていないんですけど、enterを押したらpタグを入れてshift+enterだったらbrタグを入れるというのは、wp-includes/js/tinymceの中にあるtiny_mce.jsだかwp-tinymce.jsあたりで制御してるっぽいですね。たぶん、wp-tinymce.jsの方なのかな。だからこのファイルをこねくり回せば何とかなるんじゃないかと思い、とりあえずいろいろこねくり回してみることにしました。この辺り↓のサイトさんを見ても、そんなようなことが書いてあるし。

http://modxcms.com/forums/index.php?topic=15204.0

http://d.hatena.ne.jp/tohokuaiki/20080326/tiny_mce

そういうわけで、いざwp-tinymce.jsの中身を見てみたわけなんですが……まあ～……見づらいっすね。jquery.jsなんかもそうですけど、余計なスペースとか改行を省略するために、1行で全コードを書いてあったりするじゃないっすか。だから追うのが大変でした。wp-tinymce.jsとかも、行数にすると30行足らずしかないから、1行あたりのソースがものすごく長い。某ジャンプ漫画の休載期間並に長い。if文の中にif文があってその中でfor文のループ処理を行っていて、その中でさらにif文を……みたいのが全部1行で書いてありますからね。玉ねぎかっつーの（←？）

まあ結論から言うと、さんざんこねくり回した挙句にenterとshift+enterの挙動を逆にするという操作は結局実現できなかったんですけど、今日はその話はおまけでして……今回はその時にちょっと役に立ったサイトさんがあったので、それを紹介したいというわけなんです、はい。

しかし、最近の僕は「いろいろ頑張った挙句にできませんでした」って感じの記事ばっかりだな……この前のtera termのときといい……ただのダメなやつじゃんねｗｗ。

まあそれは置いといて、今日ご紹介したいのはJs Decoderというサイト。

このサイト、javascriptのコードを貼っつけてdecodeってやると、良い感じにdecodeしてくれるんすよ。ためしにwp-tinymce.jsとかデコードしてみたんすけど、もう見やすさが違い過ぎました。美人は三日で飽きる、ブスは三日で慣れるなんて昔の人は言ったもんですが、見づらいソースは何日経っても見づらいですよね。見やすいソースは何日経っても見やすい。そりゃそうだ。

っていうか、wp-tinymce.jsとか、デコードすると普通に15000行とかあるんすけど……それを30行程度で記述するって、どんだけっすか。

このJs Decoder、個人的には結構便利だなと思いました。インデントとかもちゃんと取って表示してくれるし。