jQueryでsubmit

 jQueryいいですね。今回はsubmit時のやり方です。結構簡単です。基本はこれです。
$("form").submit( function () {
  ......
})
formタグをセレクタにして.submitイベントを指定します。後はfunction内にいろいろな指示を書けばいいだけです。
いくつかの注意点は、falseを返さないとjqueryの指示を無視したまま、そのままsubmitされてしまうことです。ですので、
$("form").submit( function () {
  ......
  return false;
})
となります。しかし当たり前の話ですがこれだといつまでたってもsubmitできませんので勿論条件制御が必要です。
$("form").submit( function () {
  ......
  if (...) {
    return false;
  } else {
    return true;
  }
})

Submit時のバリデート

 たぶんsubmitイベントはフォーム内容の入力検証、すなわちバリデートの際に使うことが殆どだと思いますのでそのちょっとしたサンプルです。
 ソース自体は簡単なものですが、サンプルのためfalseを返しています。実際はtureを返してSubmitできるようにすることになると思います。
$(function(){
    $("form").submit( function () {
        var strings = $("#text").attr("value");
        if (strings.match(/[0-9]/)) {
            var displaytext = "半角数字が入力されました。";
            $("#message").slideUp();
            $("#message").text(displaytext);
            $("#message").slideDown();
            return false;
        } else {
            var displaytext = "半角数字が入力されていません。";
            $("#message").slideUp();
            $("#message").text(displaytext);
            $("#message").slideDown();
            return false;
        }
    })
})








プロフィール



  • Name :: 山上オサム ♂(37)
  • Hobby :: 武術
  • Work :: Web Designer