jQueryでバリデーション付きメールフォームを作ろう (1/3)
今回はjQueryを使って、「問い合わせフォーム」にバリデーション（検証）機能を付ける方法を解説します。入力漏れや入力ミスがないか、サーバーへ送信する前に、クライアント側であらかじめ簡易的な検証を済ませることで、フォームのユーザビリティを高められます。今回のサンプルでは特に、入力漏れやミスのあった項目を分かりやすくユーザーに示すように工夫しています。 バリデーションルールをclass属性で設定 「問い合わせフォーム」のサンプルとして、以下のようなWebページを作成します。バリデーション機能としては、必須項目の「お名前」「性別」「どこでこのサイトを知りましたか？」「お問い合わせ内容」が入力されているか、「郵便番号」が数値で入力されているか、「メールアドレス」がメールアドレスの書式になっているか、「メールアドレス」と「メールアドレス（確認）」に入力されたテキストが同じか――をチェックします。
リアルタイムフォームバリデーション jQuery.validation.js :: 5509
お知らせ（10.08.06）： jQuery.validation.jsはアップデート・修正対応などを終了しました。 仕様などを変更したバリデーションプラグインを公開したので、そちらの方を参考にしてください。（validation.jsにはあるのにexValidationでは実装していない機能もありますが、基本的に実装は行いません） どんなフォームにも使えるjQueryのフォームバリデーションプラグイン: exValidation jQuery.validation.jsはフォーム入力のイライラを軽減して、Webブラウジングとかショッピングをもっと快適にするためのjQueryプラグインです。(もちろんサーバサイドでのチェックは必須ですが…) jQuery.validation.jsのサンプルを見てみる トピックス 特徴 ダウンロード 導入方法 1.JSファイルを読み込む 2.input要素
少ないスペースに一杯情報を埋め込めるクールなアコーディオン実装jQueryプラグイン「Easy Accordion」:phpspot開発日誌
少ないスペースに一杯情報を埋め込めるクールなアコーディオン実装jQueryプラグイン「Easy Accordion」 2010年10月04日- jQuery plugin: Easy Accordion | Andrea Cima Serniotti 少ないスペースに一杯情報を埋め込めるクールなアコーディオン実装jQueryプラグイン「Easy Accordion」。 次のようなクールなアコーディオンが簡単に実装することが出来ます。 コンテンツをタイマーで自動的に切り替えることも可能 コンテンツは次のように定義しておいて後はjQueryでやってくれるというもの。 <div id="accordion-2"> <dl> <dt>Slide title</dt> <dd><h2>First mammoth here</h2><p><img src="images/mammoths/img1.p
jQueryを使ってiframe要素の中身にアクセスする | バシャログ。
残暑の蒸し暑さから、涼しさを通り越して、寒いと感じる今日この頃、tanakaです。 今日はjQueryでiframe要素の中にアクセスして、情報を取得したり、改変したりする方法を紹介します。 jQueryは、Webページに対するアクセスを簡潔に表現できるライブラリですが、iframe内の文書にまで、 $('div iframe p') といった感じでアクセスすることはできません。ドキュメントが違うからでしょうか？正しい理由はわかりませんが、同時に2つのページをまたいで処理するのは混乱しそうなのでこれはこれでいいと思います。で、そういったときにアクセスする方法があるのでご紹介します。 [追記 2010/09/27]注意点として、親フレームとiframe内ドキュメントのドメインが異なる場合はアクセスできません。 iframe内のドキュメントにアクセスするにはcontents() $(...).
[JS]フォームの入力欄にテキストを表示するスクリプト -Textbox Hinter
設置も簡単、カスタマイズも容易、フォームのテキストボックスとテキストエリアにテキストを表示するスクリプトを紹介します。 表示するテキストにはclassを付与できます（Demo 3参照）。 jQuery Textbox Hinter Plugin デモページ 主な特長 シンプルで軽量 スクリプトの知識は不要 表示するテキストにclassを付与できる textareaにもテキスト表示が可 クロスブラウザ対応 カスタマイズが簡単 デモと実装方法 実装は簡単で、フォームの各パーツに任意のclassを与え、テキストはJavaScriptに記述します。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Tatchies | Welcome
