IISにOSSをインストールするための情報サイト [IIS de OSS 64bit]

[[IIS de OSS 64bit]] > [[調査室]] > JavaScriptサンプル

*JavaScriptサンプル [#qb420e1f]

▼目次
#contents

*Webサイトへメールアドレスを載せる [#ae7b2d11]
**Webサイトへメールアドレスを載せる [#ae7b2d11]
HTML上に直にメールアドレスを記載すると、スパムロボットに拾われてしまい、たくさんの迷惑メールが届くようになってしまう。

メールアドレスを取得する形式のロボットの動きは、おそらく単純で、URLからHTMLを取得後、@の入った文字列を収集しているのだろうと思われる。(<a href="mailto&#58;****">で拾っているかもしれないが・・・)

そこで、このメールアドレスの表示をHTMLへのべた書きではなく、javascriptの文字列連結で表示させるように工夫してみよう。

ここでは、HTMLにて ”お問い合わせは boo&#64;example.com まで。"のような表示をさせてみよう。
まず、head タグ内に以下の記述をする。
 <meta http-equiv="content-script-type" content="text/javascript" />
 <script type="text/javascript">
 <!--
     function setMailAddress(name, domain) {
     document.getElementById("mail").innerHTML = name + '@' + domain;
     }
 // -->
 </script>
続いてBODYタグに onLoad属性を付ける
 <body onLoad="javascript:setMailAddress('boo','example.com');">
最後にBODY内部のメールアドレスを表示させたい場所に以下のコードを埋める
 お問い合わせは <span id="mail"></span> まで。

*コメント [#b8ace830]
**exValidationで作ったフォームからmailtoを有効化させる [#v0bcf4b1]
[[exValidation>http://5509.me/log/exvalidation]]は、通常のPOSTやajax経由のポストを前提としており、私がやった限りでは、FORMのMAILTOに対応していない。&br;
そこで、「customClearError」の実装でわざとjavascriptエラーを起こしてjavascriptを無効化し、通常のFORMの動作を有効にさせる方法をとってみる。&br;
↓こんな感じ
 customClearError: function() {
  document.getElementById("_raise_error_").innerHTML = "";
 }
↓Javascript全体の実装例
 $(function(){
  $("form")
   .exValidation({
    rules: {
     name: "chkrequired chkzenkaku chkgroup",
     email: "chkrequired chkhankaku chkgroup"
    },
    errInsertPos: 'after',
    errPosition: 'fixed',
    customAddError: function() {
     if ( $("#alert").length<1 ) {
      $("p.attention").before("<div id=\"alert\"><strong>未記入項目があります。</strong></div>");
     }
    },
    customClearError: function() {
     $("#alert").remove();
     document.getElementById("_raise_error_").innerHTML = "";
    },
    customScrollAdjust: function() {
     return $("#alert").offset().top;
    }
   });
 });
#「_raise_error_」というidがHTML上に存在しないため、該当ファンクション動作時にjavascriptエラーとなり、処理が止まる&br;
↓HTML部の実装例
 <form method="post" action="mailto:tarou@example.com?Subject=test">
   <table>
     <tr>
       <th>お名前<span>*</span></th>
       <td>姓<span id="name"><input type="text" id="name1" name="email" value="" />
       名<input type="text" name="neme2" value="" /></span></td>
     </tr>
     <tr>
       <th>メールアドレス<span>*</span></th>
       <td><span id="email"><input type="text" id="email1" name="email1" value="" />
       @<input type="text" name="email2" value="" /></span></td>
     </tr>
   </table>
   <p class="submit">
     <input name="送信" type="submit" class="button" value="送信" />
   </p>
 </form>
#「送信」クリック時、全てのチェックが終わった後でjavascriptの動作が途中で停止する。&br;
#そしてexValidatorが無効になり、HTMLのactionが動作する。



**コメント [#b8ace830]

#comment



トップ   一覧 単語検索 最終更新   ヘルプ