スマホで文字数カウントはsetTimeoutを使う

リアルタイムの文字数カウントをスマートフォンで実装する方法の解説です。 簡単に言うと、setTimeoutを使う必要があるみたいです。


スマホで文字数をカウントするにはsetTimeoutを使う


タイトルの通りです。スマホでリアルタイムに文字数をカウントするためには、JavaScriptのsetTimeoutを使う必要があるようです。


スマホでは、機種によって文字入力時に発生するイベントが違うらしく、全デバイス対応をするためには「タイマーで一定時間ごとに文字数を数える」という処理が必要なようです。


もうちょっと詳しい話は下記のサイトに載っています。


スマホではsetTimeoutを使う必要があるよ、という説明。

iPhoneのsafariでも文字数カウントを



スマホで文字数カウントを実装する時に参考になるサイト


スマホで文字数カウントを実装する時に参考になりそうなサイトをいくつか挙げます。


汎用的な文字数カウントのサンプルコード。PCの各種ブラウザでは動くようです。

JavaScriptでtextareaに入力中の文字数をカウントする


ここも汎用的なコードの紹介。上のリンクと合わせて読むと、文字数カウントのコードがなんとなくつかめる。

jQueryで入力フォームに文字カウント(カウントダウン)を設置する方法


jQueryで扱えるイベント一覧が載ってるサイト。

jQuery日本語リファレンス


jQueryでcopy、cut、pasteイベントを扱う方法について解説しているページ(英語)。

How do you handle oncut, oncopy, and onpaste in jQuery?


最後のページのみ英語なのでちょっと訳すと、


jQueryが標準で対応しているイベントにpaste等はないです。けど、jQuery(document).bind('paste', function(e){ alert('pasting!') })このコードでブラウザによっては動きます。正しく各種のブラウザに対応したいなら、jQueryのプラグインを別途使う必要があります。


という感じのようです。


以上、自分用まとめ終わり。

著者プロフィール
Webサイトをいくつか作っています。
著者プロフィール