By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
457,712 Members | 1,390 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 457,712 IT Pros & Developers. It's quick & easy.

How to disbale/enable some links using javascript dynamically?

P: n/a
Hi,

Depending on the user input I need to disbale/enable some of the links
in my page. When disbled I need to display the links as normal text
with cursor changed to mouse pointer style and when enabled I need to
change it back to the normal link.
I tried using document.getElementsById('myLink').style but I am getting
'Object doesnt support this property...'
Can you suggest please ?

Thanks a ton.
CG

Oct 25 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
Lee
cotton_gear said:

Hi,

Depending on the user input I need to disbale/enable some of the links
in my page. When disbled I need to display the links as normal text
with cursor changed to mouse pointer style and when enabled I need to
change it back to the normal link.
I tried using document.getElementsById('myLink').style but I am getting
'Object doesnt support this property...'
Can you suggest please ?


<html>
<head>
<title>enable links</title>
<script type="text/javascript">
function returnTrue() { return true; }
function returnFalse() { return false }
function enableLink(linkid,enable) {
var link=document.getElementById(linkid);
if(enable) {
link.onclick=returnTrue;
link.style.textDecoration="underline";
link.style.cursor="pointer";
} else {
link.onclick=returnFalse;
link.style.textDecoration="none";
link.style.cursor="default";
}
}
</script>
</head>
<body>
<a id="alpha" href="http://www.google.com">google</a><br>
<a id="beta" href="http://www.wikipedia.com">wikipedia</a><br>
<a id="gamma" href="http://www.yahoo.com">yahoo</a><br>
<button onclick="enableLink('beta',false)">disable wiki</button><br>
<button onclick="enableLink('beta',true)">enable wiki</button><br>
</body>
</html>

Oct 25 '05 #2

P: n/a
cotton_gear wrote:
Hi,

Depending on the user input I need to disbale/enable some of the links
in my page. When disbled I need to display the links as normal text
with cursor changed to mouse pointer style and when enabled I need to
change it back to the normal link.
I tried using document.getElementsById('myLink').style but I am getting -----------------------------------^

try:
document.getElementById(...
You only get one of 'em! You might also try using the links
collection rather than getElementById.

'Object doesnt support this property...'
Can you suggest please ?


One option is to have an A element and a span with plain text - hide
the A and show the span for disabled, swap for enabled.
Trivial example:

<a name="appleLink" href="http://www.apple.com">Apple</a><span
style="display: none;" id="appleText">Apple</span><br>

<input type="button" value="disable/enable link" onclick="
var aStyle = document.links.appleLink.style;
var sStyle = document.getElementById('appleText').style;
aStyle.display = ('none' == aStyle.display)? '' : 'none';
sStyle.display = ('none' == sStyle.display)? '' : 'none';
">
--
Rob
Oct 25 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.