How to disable a Hyper Link?

PHP
1

I wonder if this is possible.

Let say i have a link or hyper link.

after i click that link (left click) the link will disable and turn it’s color into gray.

is this possible in php? if no possible in php maybe javascript or css?

any sample? or tutorial?

Thank you a ton.

2

You would need to use Javascript and modify the anchor through the DOM. You cannot stop a link from being clickable. To do this you would need to use Javascript. You could use PHP but that would require a new page request.

You have 2 options.

  1. Grey it out using CSS. To do this you would need to go through the DOM and give or change that anchors class. You could modify the style directly also.

  2. Remove the <a> and replace it with a <span>

3

hi cascadingstylez

thanks for the reply man.

but could you give me sample please.

4

You’ll need jQuery for this piece of code:


  $(document).ready(function(){
    $("a").click(function () {
      $(this).fadeTo("fast", .5).removeAttr("href");
    });
  });

If you don’t use jQuery I would suggest using it since it sounds like you’ll need it for odd jobs throughout your project. It’s elegant, compact, and very easy to use

5

Or without jQuery, since it would be overkill for just this (and that code does it for every link):

a.disabled:link, a.disabled:visited { color: grey; }

<a href="http://example.com" onclick="this.removeAttribute('href');this.className='disabled'">Link</a>
6

Or that, but you can narrow the selector down to classes, or anchors within a certain div with jQuery as well (and you wouldn’t have to add the onClick even to each anchor)


  $(#document).ready(function(){
    $("#disabled a").click(function () {
      $(this).fadeTo("fast", .5).removeAttr("href");
    });
  });

If this is the only thing you need to do jQuery is overkill, like sk89j said.

7

If this is for something mission critical, you’ll want to use PHP.

If this is just something to enhance visitor experience, something like this will work in modern browsers.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title>Title</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<style type="text/css">
	span.dis-able
	{
		color: #666;
	}
	span.dis-able > a
	{
		color: #123456;
	}
	span.dis-able > span, span.dis-able > a:visited
	{
		display: none;
	}
	span.dis-able > a:visited + span
	{
		display: inline;
	}
	</style>
</head>
<body>
	<div>
		<span class="dis-able"><a href="#anchor">Anchor Here</a><span>Anchor Here</span></span>
		<br/>
		<span class="dis-able"><a href="http://non-existant.com/">Unvisited Link</a><span>Unvisited Link</span></span>
	</div>
</body>
</html>