読者です 読者をやめる 読者になる 読者になる

Life goes on

何かJavaScriptとかVimとかMacとかに関係してそうな深淵から覗かれる者

何かもっとスマートにしたいんだけどなあ

Web関係 Program

こないだ仕事で「試しに作ってくれ」と言われて作ったものが、お蔵入りしたのでエントリした。反省してない。

何かと言うとですね、俺が知ってる範囲だと2chとかスラドがそうなんですが、外部のURLをクリックした時に「次のリンクは外部リンクですよ。良ければクリックしてくださいな」ってページを挟む処理です。

で、あんまり時間もなかったんでどうしよう…と思い結局力技に。クリックされたURLをクエリにしちゃってPHPでデコードするという…。一応下のコードがそれなんですが、これってJavascriptだけで処理できたりすんのかなあ。PHPは単にクエリをデコードするだけなんで、出来れば全部Javascriptの方が良いかなと思ったんだけど、ちょっと思い付きませんでした。

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""
"http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script src="http://www.google.com/jsapi"></script>
    <script>
      google.load("jquery", "1");
    </script>
  </head>
  <body>
    <div id="linkarea">
      <a href="http://www.google.com/" target="_blank" class="externalLink">Google</a><br>
      <a href="http://www.yahoo.co.jp" target="_blank" class="externalLink">Yahoo!</a><br>
      <a href="test.html">テスト</a>
    </div>
    <script src="test.js" type="text/javascript" charset="utf-8"></script>
  </body>
</html>

js

$(function() {
  $(document).ready(function(){
    $(".externalLink").click(function() {
      var linkurl = $(this).attr("href");
      $(this).attr('href', "link.php?" + encodeURIComponent(this.href)).blur(function() {
        $(this).removeAttr("href").attr("href", linkurl);
      });
      window.open(this.href, "newWindow", "width=500,height=600,toolbar=no", "_blank");
      return false;
    });
  });

PHP

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""
"http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script src="http://www.google.com/jsapi"></script>
    <script>
      google.load("jquery", "1");
    </script>
  </head>
  <body>
    <div id="urlarea">
      <p>リンク書き替えしました</p>
      <!-- <a href="">リンク</a> -->
      <?php
      $url = urldecode($_SERVER["QUERY_STRING"]);
      echo '<a href="'. $url.'" target="_blank">'.$url.'</a>'; 
      ?>
    </div>

  </body>
</html>

改めて見るとまあ、力技だな…。しかもポップアップでって言われたの思いだした。メチャクチャだわー。