フォームデザイン（submitイベント）

jQuery フォームデザイン

お次はsubmitイベント。
ただし、これはformタグに絡むのであって、submitしたボタンで発生するわけではないので注意。

サンプルではzipcodeというIDのformタグと、その中で「type="submit"」指定されたinputタグ（ボタン）を定義し、
そいつがクリックされた時に、formで発生するsubmitイベントで、郵便番号の入力チェックをしている感じ。
ちなみにサンプルソース中にも記述されているけど、郵便番号サービスはここを使った。
読めば分かるけど、使用可能なメソッドはgetで、引き渡す必須の変数は"zn"なので、form中にこの名前のinputタグも定義してある。

<html>
  <head>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">google.load("jquery", "1.3.2");</script>
    <script type="text/javascript">
      $(function(){
        $("#zipcode").submit(function () {
          var zipcode = $("#zn").val();
          if (zipcode == null || zipcode == "")
          {
            alert("郵便番号を入力してください。");
            return false;
          }
        });
      })
    </script>
  </head>
  <body>
    <form id="zipcode" method="get" action="http://zip2.cgis.biz/csv/zip.php">
      <span>郵便番号検索</span>
      <input id="zn" name="zn" type="text" value="" />
      <input id="confirm" type="submit" value="問い合わせ" />
    </form>
  </body>
</html>