• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 222
  • Last Modified:

Lock links after first click on a link?

How do I do the following:
I want to use javascript to lock the links of a page, once a link was clicked.
Since it's my page, I don't have to use real links (although if possible it's prefered).

Example:
Say there are two links on my page:
http://www.ibm.com
and http://www.microsoft.com

Now once the first link is clicked I want the others to become inactive.

ADVAthanksNCE,  Moshe
PS. I'll give the question more points as they come...
0
mflam
Asked:
mflam
1 Solution
 
xabiCommented:
ok, you can "lock" links using Javascript, but if you reaload the page all the info saved about the locked links will be lost. Anyway you can only lock the links that open a page in a window or in another frame. Imagine you have two frames. 1 with the links and the other with the contens. The links will be something like:

<a href="javascript:open_link('foo.htm')">Link 1</a>

and your javascript will be something like:

<script language="javascript">
<!--
var locked = false
function open(new_url) {
  if (!locked) {
    locked = true
    // open the link
  } else {
    alert("Locked")
  }
}
//-->
</script>

As you can see I store the info in the var locked, but if you reload the page the variable will be initialized again.

xabi
0
 
drajendranCommented:
Do you use frames?
0
 
mflamAuthor Commented:
Here's what I figured out myself meanwhile:
===============================
Using onClick and return(false)
===============================

If I write:

<a href=http://www.ibm.com
onClick="if (locked) return(false) else { locked = true; return(true)}
IBM </a>

It works for all links!

But if I use:

<a href=http://www.ibm.com
onClick="linkOnce()"
IBM </a>

and in the javascript section after the var: locked = false I add:

linkOnce()
{
  if (true == locked)
      return(false)
  else
  {
      locked = true;
      return(true);
  }
}

This for some reason does not work!
Can someone tell me how to fix it?

ADVAthanksNCE, Moshe  

0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
nericsonCommented:
You may be having a scope problem.  I have had things like this happen before.  "debugger" should tell you here.

I think I fixed it w/ an eval().

Another way to do it (w/ some browsers) is innerHTML (or outer or Text).  Change it to <A id=IBM name=IBM href="">bla</A>.
0
 
KeClCommented:
mflam: It's easy: instead of

<a href=http://www.ibm.com
onClick="linkOnce()"
IBM </a>

write:

<a href=http://www.ibm.com
onClick="return linkOnce()"
IBM </a>

with the same function as you told above.

Good luck!
0
 
KeClCommented:
Exactly your code may look like this (I forgot '>' after <a href=http://www.ibm.com
onClick="return linkOnce()" in previous comment) :


<html>
<head>
<title></title>
<script>
var locked = false;
function linkOnce()
{
if (locked)
return(false)
else
{
locked = true;
return(true);
}
}
</script>
</head>
<body>
<a href="javascript:alert('click');"
onClick="return linkOnce()">IBM</a>
<a href="javascript:alert('click');"
onClick="return linkOnce()">MBI</a>
</body></HTML>
0
 
mflamAuthor Commented:
And a friend of mine showed me how the code could be even more elegant using a return of "isFirstClick"! instead of "isLocked".

Thanks!  Moshe
0

Featured Post

The 14th Annual Expert Award Winners

The results are in! Meet the top members of our 2017 Expert Awards. Congratulations to all who qualified!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now