Minory

日本語 特有の問題とも言えなくもないが、 入力フォーム を構築する上でよくある 全角 ・ 半角 の問題。 前回、 正規表現 の記事の時にも書きましたが、ユーザーは基本的に自由に入力できるので、それを制御する側は大変です。 今回も忘れないように、 全角 ・ 半角 変換 スクリプト をメモっておきます。 アプリを開発する上で、文字や数字の妥当性をチェックする際に欠かせないのが正規表現。いくら説明されても何かの暗号のようでなかなか理解できません。こうなったら、よく使う正規表現をコピペですぐ利用できるようにまとめておきましょう。フォームでよく使う正規... 【保存版】PHPとJavaScript兼用！エラーチェック用の正規表現一覧 - Minory 英字・数字・記号を変換 PHP では mb_convert_kana() 関数が用意されていますが、 JavaScript では 正規表現 を利用して変換します。 少々面倒ですが、後に記述する カタカナ の 全角 ・ 半角 変換 よりは比較的簡単です。 全角英数字を半角英数字にする場合 function toHalfWidth(elm) { return elm.value.replace(/[Ａ-Ｚａ-ｚ０-９！-～]/g, function(s){ return String.fromCharCode(s.charCodeAt(0)-0xFEE0); }); } 半角数字を全角数字にする場合 function toFullWidth(elm) { return elm.value.replace(/[A-Za-z0-9!-~]/g, function(s){ return String.fromCharCode(s.charCodeAt(0)+0xFEE0); }); } 参考： 【jQuery】inputの全角数字・全角アルファベットを半角に変換 – Qiita カタカナを変換 カタカナ も PHP の mb_convert_kana() のように一発で変更できれば良いのですが、どうやら1つずつ 置換 するしか無いようです。 半角カタカナを全角カタカナにする場合 function toFullZ...

jQuery の呼び出す時の 書き方 が何通りかあります。 皆さんも何度か目にしたと思います。 どれも同じように見えますが、実際には 書き方 にって 動作 が違います。 jQueryの書き出し 例えば、以下のようによく見かける 3つ の 書き方 があります。 $(function(){}); $(document).ready(function(){}); $(window).load(function(){}); 他にも、 $() を jQuery() と書くこともありますが、ここでは割愛します。 結論から言うと、 $(function(){}); と $(document).ready(function(){}); は同じ動きをしますが、 $(window).load(function(){}); は 実行 タイミング が違います。 参考にしたサイトがとても詳しく解説されていたので引用しています。 引用： jQueryの読込み「ready」と「load」と「function」の順番について | web-wizardry 実行する順番 ready と load に絞って話を進めます。 基本、プログラムは上から下に実行されますが、ここでは ready が先、 load が後に読み込まれるということを紹介しておきます。 具体的な順番は次のようになります。 ページの読み込みが始まる HTMLの読み込みが終わる $(document).readyが実行 画像など含めすべてのコンテンツの読み込みが終わる $(window).loadが実行 引用： 【jQuery】処理実行タイミング $(document).readyと$(window).load – Qiita 2つの決定的な違いは？ どちらも HTML の読み込みが終わった状態ですが、 画像 など コンテンツ 全体の読み込みが終わった後に実行されるのが load です。 しかし、単純に順番の問題ではなく、適切に使い分けることが重要です。 例えば、 ready の場合は画像が読み込み終わっていないので、 CSS で指定していない大きさが可変の画像に対して、幅や高さを取得しようとするとおかしくなります。 以下、使い分け方の例です。 [ready] htmlを...

Jetpack 肯定派の意見が多い世の中で、敢えて 批判 を書きます。 最初は、他の プラグイン をインストールしなくても、 Jetpack だけで多くの欲しかった機能を導入することができると喜んで導入してみました。 確かに使えるといえば使えるのですが、1つ1つの機能に力を入れているわけではなさそうで、やはりそれ専用の プラグイン には敵わず、凝ったことはせずにただ運用するだけなら十分といった感じです。 The one plugin you need for stats, related posts, search engine optimization, Elasticsearch-powered search, social sharing, protection, backups, speed … Jetpack by WordPress.com - WordPress.org 画像を圧縮する機能 Jetpack には、表示速度を上げるために 画像 を 圧縮 する機能があります。 スマホが中心の世の中なので、一見便利なように思いますが、コレが曲者。 他の画像系 プラグイン と一緒に使うと、画像がすごく荒く見えたり、表示したいサイズと合わなかったりするのです。 それだけならまだしも、表示されないこともありました。 フルスクリーン 表示も然り。 もっと優秀な Lightbox 系の プラグイン がたくさんあります。 記事一覧の無限スクロール 無限スクロール とは、指定した件数を表示している一覧ページを最後まで スクロール すると、次(古い記事)のページを自動的に読み込んで、一覧の最後尾に差し込む機能です。 これはどうなんだろう？ スマホ では便利かもしれませんが、微妙です。 一見便利そうに思いましたが、 ページャー が表示されなくなってどれくらいの記事数があるかわからなくなり、 フッター に用意したコンテンツが見れなくなることからやめました。 投稿と同時にSNSシェアする 投稿した際に、記事を Twitter や Facebook に シェア したくなります。 そんな時も Jetpack が自動的にやってくれるのですが、 IFTTT の方が シェア する内容を細かく指定できます。 IFTTT は Wo...

Laravel には __() という ヘルパ関数 があることをご存じだろうか。（アンダーバー2つ） 例えば、以下のように 日本語 メッセージ ファイルを作ったとして、それを取得するには、 Lang::get() メソッド を使用していました。 Laravelの多言語化 以前、 Laravel を 日本語化 する方法を紹介しましたので、今回は 日本語化 した メッセージ を便利に取得する方法をご紹介します。 翻訳が面倒だったLaravel 5.5（LTS）の日本語メッセージファイル一式を作成し、GitHubで公開していますので、自由にダウンロードしてください。バリデーションやページネーションなど4つのメッセージファイルを日本語化しています。Laravel 5.5 日本語メッセージファ... Laravel 5.5の日本語メッセージファイルを公開！バリデーションを日本語化！ - Minory 日本語ファイルのディレクトリ構成 /resources /lang /en messages.php /ja messages.php 日本語メッセージの取得 \Lang::get('message.welcome'); しかし、そんなに長ったらしく書かなくても簡単に取得できることを知りました。 それが、 __() という ヘルパ関数 です！ 実際にはこのように取得します。 echo __('messages.welcome'); 短っ！！ キーに文字列を使用する しかも、 resources/lang 直下に、 resources/lang/ja.json を作り、 { "I love programming.": "私はプログラミングが大好きです。" } このように書いて、 echo __('I love programming.'); このように取得すると、もし言語ファイルが存在しない場合でも「I love programming.」をそのまま表示してくれるという優れものです。 プレースホルダを定義する さら...