DOM構築後の有効リンク・無効リンクのテスト

by iwbjp

HTML

<div id="s"></div>

JavaScript

$(function(){
  var url = 'http://www.google.co.jp/';
  $("#s").html(
    '<p><a href="' + url + '" target="_blank" class="link">有効リンク</a></p>' + 
    '<p><a href="' + url + '" target="_blank" class="link disabled">無効リンク</a></p>' + 
    '<p><a href="#" target="_blank" class="unlink">クリック後にURL受け取り</a></p>' + 
    '<p><a href="#" target="_blank" class="unlink2">クリック後にURL受け取り（url取得0.1秒遅延）</a></p>'
  );
  
  $(".link").click(function(){
    if($(this).hasClass("disabled")){
      $(this).removeClass("disabled");
      return false;
    }
  });
  
  $(".unlink").click(function(){
    $(this).attr("href", url);
  });
  
  $(".unlink2").click(function(){
    setTimeout(function(){
      $(this).attr("href", url);
    }, 100);
  });
});