タグ

jqueryとフォームに関するclicktxのブックマーク (3)

  • フォームで離脱させないためのjQueryプラグイン50選|designaholic -Creative Column-

    最近では、エントリーフォーム最適化(EFO)という施策も広まってきましたが、特に購入やサンプル請求、お問合せ等がコンバージョンとなっているサイトではフォームで離脱されてしまってはせっかくの広告や施策が水の泡になってしまいます。 ここではユーザーを離脱させないために気をつけたいポイントとそれを実現するために便利なjQueryのプラグインを紹介します。   まず、入力フォームを作成する際のポイントは、ユーザーにストレスを感じせない事です。ストレスの原因となるものは大きく言うと   入力しづらい、エラーメッセージがわかりづらい、といった操作に関するもの。 どこまでやれば完了なのかわかない、個人情報の扱いが心配、といった心理的なもの。   です。なのでこの点を解消させてあげるフォームを作成すればユーザーが離脱する可能性は下がりますね。 具体的なポイントは以下のような項目になります。   必須入力か

  • jQuery ValidationをTwitter Bootstrapと組み合わせて使う - Qiita

    jQuery Validationは名前の通り入力チェックを行うjQuery pluginです。サーバーサイドでチェックを行わないため画面遷移がなく、その場で入力ミスが分かるためユーザービリティーが上がります。 しかし、Twitter Bootstrapでデザインを組んでいると、エラー発生時に入力フォームが赤くならないため、以下のコードを追加します。 errorClass:'error', errorElement:'span', highlight: function (element, errorClass, validClass) { $(element).parents("div[class='control-group']").addClass(errorClass); }, unhighlight: function (element, errorClass, validCla

    jQuery ValidationをTwitter Bootstrapと組み合わせて使う - Qiita
  • jQueryで色々なフォーム入力値をリアルタイム取得する

    jQueryでフォームの入力地をリアルタイムで取得する方法を紹介します。 フォームのvalue値をリアルタイムで取得したい場合、必ずしも フォームのパーツからフォーカスが外れた時やクリック時とは限りません。フォームの入力値が変更されたことを取得していきます。 jQueryのchangeイベントがかなり便利 今日まで知らなかったのですが、フォームのvalue値が変更されたことを知るにはchangeイベントがかなり便利なようです。 プルダウンが変更されたら フォームのプルダウンが変更されたらvalue値がリアルタイムに変更されます。 ソースコード $("#select1 select").change(function () { var str = ""; str = $(this).val(); $("#select1 div").text(str); }).change();

    jQueryで色々なフォーム入力値をリアルタイム取得する
  • 1