テキストボックスの入力値を数値限定にしてくれる「jQuery - numeric」

「jQuery - numeric」は、テキストボックスへの入力を数字のみに制限してくれるjQueryプラグインです。正/負、整数/小数点 チェックまで限定してくれます。ダウンロード

スクリプト

<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery.numeric.js" type="text/javascript"></script>

実装

<input class="numeric antirc" type="text">
<input class="integer antirc" type="text">
<input class="positive antirc" type="text">
<input class="positive-integer antirc" type="text">

<script type="text/javascript">
// 数値
$(".numeric").numeric();
// 整数
$(".integer").numeric({ decimal: false });
// 正の数値
$(".positive").numeric({ negative: false });
// 正の整数
$(".positive-integer").numeric({ decimal: false, negative: false });

// *「右クリック貼り付け」対応
$(".antirc").change(function() {
    $(this).keyup();
});
</script>

全角チェックも含めて、主要なブラウザでは特に問題なく動作しました。
(Firefox, Chrome, IE8+, Opera, Safari)
デモ

マウスで貼り付けができてしまうので、ひと処理追加しました。
  • このエントリーをはてなブックマークに追加

関連記事

no image

「jqPlot」を使って棒グラフを作成

jqPlotを使って棒グラフを作成してみました。ベースはこの記事を参照ください。 スクリプト jqPlotのベースとなるjsファイルと以下の棒グラフの作成に必要なスクリプトを読み込んで下さい。

わずかなコードで画像をサムネイル化してくれる「MyThumbnail.js」

サムネイル化してくれるJQueryプラグインは数多くありますが、この「MyThumbnail」はわずか数行で簡単にページ上の画像を指定サイズにサムネイル化してくれます。 ダウンロード 画像とし

iTunesのCover Flowのようなギャラリーが実装できる「ContentFlow」

「ContentFlow」は、iTunesのCover Flowのように左右に流れるギャラリーが実装できるjQueryプラグインです。ダウンロード スクリプト 実装

マウスオーバーでキャプション表示してくれる プラグイン

画像マウスオーバーするとキャプションを出現させるプラグイン (jQuery 1.10.2で動作確認のできたものに限定しています。デモ一覧) imgタグの#alt属性から自動でキャプションを生成

no image

要素を折りたたみできる「nestedAccordion」

「nestedAccordion」は、クリックすると要素を開閉(折りたたみ)できるjQueryプラグインです。名前の通りネストして、アコーディオンの中にアコーディオンも実装できます。ダウンロードはこち

Bootstrap Modal + 拡張機能が実装できるプラグイン(Bootstrap 2)

Twitter Bootstrap Modalは、標準のモーダルウィンドウに様々な機能を追加することができます。 Twitter Bootstrap純正スクリプト ダウンロード / サイト

no image

クリックするとテキストボックスにかわるラベルを実装

Flickrなどでは、写真の編集画面でキャプションをラベルとして表示しておきクリックするとテキストボックスやテキストエリアに変換してくれて編集させるようなインターフェイスを実装しています。結構いいです

selectボックスを華麗にしてくれる「Chosen」「Select2」

selectボックスに当てるjQueryプラグインを色々探してみましたがこれに決めました。シングルやマルチ、またグループにも対応しています。インスタンス検索してくれるのが決め手 Chosen CDN

カルーセル プラグイン

「カルーセル(Carousel)」とは"回転木馬"という意味らしいのですが、jQuery(Javascript)では画像やコンテンツをスライド表示させるもののようです。が、スライダーとの違いはよく分り

no image

定期的にAjaxリクエストを送信してくれる「PeriodicalUpdater」

PeriodicalUpdaterは、定期的にpostもしくはgetリクエストを送信してくれるjQueryプラグインです。Twitterのタイムラインのように定期的にツイートをロードしてくれるようなや

Comment

  1. jQuery | テキストボックスの入力値を数値限定にしてくれる「jQuery – numeric」 | Think deeply, Do less, More effective

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

PAGE TOP ↑