Home > Web Front-end > JS Tutorial > Example of using Disabled attribute of hyperlink_javascript skills

Example of using Disabled attribute of hyperlink_javascript skills

WBOY
Release: 2016-05-16 16:40:43
Original
2761 people have browsed it

You can set the hyperlink's Disabled attribute to true and false to determine whether the hyperlink can be clicked

For example:

<a herf='http://www.baidu.com' onclick='return click(this);' disabled='ture'>bai du</a>
Copy after login

The above means that you don’t want Baidu’s hyperlink to take effect, but if you don’t make any restrictions or judgments on the click, it will naturally jump to the Baidu page when you click Baidu. This is the disabled attribute of hyperlinks in HTML. bug
You can add the following js constraints to determine whether the hyperlink can be used

<script language='javascript'> 
function click(obj) 
{ 
if(obj.disabled) 
{ 
return false; 
} 
return ture; 
} 
</script>
Copy after login

The following bug solutions provided by Microsoft:

With the help of global variables, use other buttons to change the disabled attribute to get the effect of disabling the attribute.;

BUG: DISABLED attribute no longer disables hyperlinks
Although the DISABLED attribute is set to True a hyperlink is in the following
Where do you want to go today?
The user can still click the hyperlink and Internet Explorer navigates to the selected page.

To resolve this issue, set the onclick event of the hyperlink to return true or false based on the current execution context. The following code sets the value of a global Microsoft JScript variable to true or false , depending on the button click. The DISABLED property of the target hyperlink object is updated so that it can properly communicate its disabled state to other objects and scripting functionality on the page.

<html> 
<head> 
<title>Workaround for DISABLED Attribute Problem</title> 
<SCRIPT> 
var canNav = false; 
function canNavigate() { 
return canNav; 
} 
function load() { 
document.all("btn1").innerText = "Link status == " + canNav; 
} 

function setNavigate(linkObj, canNavParam) { 
if (linkObj != null) { 
if (canNavParam == false) { 
linkObj.disabled = true; 
} else { 
linkObj.disabled = false; 
} 
canNav = canNavParam; 
} 
} 

function updateBtnStatus(btnName) { 
var btn = document.all(btnName); 
if (btn != null) { 
document.all(btnName).innerText = "Link status == " + canNav; 
} 
} 
</SCRIPT> 

</head> 
<body onload="load();"> 
<a id="lnk1" disabled=true href="http://www.microsoft.com/" rel="external nofollow" rel="external nofollow" onclick="return canNavigate();">Click here</a><p> 
<button id=btn1 onclick="setNavigate(document.all('lnk1'), !(canNav));updateBtnStatus('btn1');"> 
</button> 
</body> 
</html>
Copy after login
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template