`

如何让 href 失效(转)

阅读更多

 合理使用 return  false;
注意其中的原理:



<href="http://www.google.cn" onclick="return myclick();">链接到谷歌</a>

<script type="text/javascript">
   
function myclick(){
      alert('呵呵,我失效了吗?');
      
return false;
   }

</script>



当然,还可以利用链接到一个函数的方式,如下:

<href="javascript:goto();">链接失效咯。</a>


================================

<html>  
<head>  
</head>  
<body>  
<a   href="http://www.sina.com">连接</a>  
<input   type=button   value="dian">  
</body>  
</html>  

当点击button后   ,如何使上面超链接无效??  


<a   href="http://www.sina.com"   id="mylink">连接</a>  
<input   type=button   value="dian"   onclick="mylink.href='#'">  

<html>  
<head>  
</head>  
<body>  
<a   href="http://www.sina.com">连接</a>  
<input   type=button   value="dian"   onclick="mylink.href=''">  
</body>  
</html>

<html>  
<head>  
<SCRIPT   LANGUAGE="JavaScript">  
<!--  
function   test(){  
aaa.disabled=true;  
aaa.onclick=function(){return   false}  
}  
//-->  
</SCRIPT>  
</head>  
<body>  
<a   href="http://www.sina.com"   id=aaa>连接</a>  
<input   type=button   value="dian"   onclick="test()">  
</body>  
</html>

这一个比较经典,我,曾经见过!!!
<a   href="http://www.sina.com"   id="mylink">连接</a>  
<input   type=button   value="dian"   ID=Button1   onclick="document.links('mylink').outerHTML='连接';">

<a   href="http://www.sina.com"   id="mylink">连接</a>  
<input   type=button   value="dian"   ID=Button1   onclick="document.links('mylink').disabled=!document.links('mylink').disabled;">

<html>  
<head>  
<script   language="javascript">  
function   Disable(){  
var   strTxt=mylink.innerText;  
mylink.outerHTML="<font   id='mylink'   color='black'>"+strTxt+"</font>";  
}  
</script>  
</head>  
<body>  
<a   id="mylink"   href="http://www.sina.com">连接</a>  
<input   type=button   value="dian"   onclick="Disable()">  
</body>  
</html>

============================================
这是一个很经典的通过 css 来控制的:

<HTML> <HEAD>
<meta http-equiv="Content-Language" content="zh-cn">
<TITLE>建站学|www.jzxue.com|---让网页上的超链接失效,不能点击</TITLE>
<style> a {poorfish:expression(this.onclick=function kill(){return false})} </style>
</HEAD>
<BODY>
<p><a target="_blank" href="http://www.jzxue.com">建站学</a></p>
<p>
<a href="http://www.163.com">www.163.com</a>
</p>
<p>
<a href="http://www.sohu.com">www.sohu.com</a></p> <p> 
</p>
</BODY>
</HTML>

===================================
在开发中时常会遇到这样的需求:让某些描述信息(这些描述信息已经进行过安全html过滤,所以不会包含Javascript等脚本语言,但是允许正常的链接)里的链接失效,但是不要或者这些描述信息.如要以下代码块里的链接失效

<div id="desc">
<a href="http://www.9i56.cn">无聊网</a>
</div>

  只需要再后面插入下段Javascript既可<script type="text/javascript">
var elements = document.getElementById('desc').getElementsByTagName('A');
for (var i = 0, len = elements.length; i < len; ++i) {
elements[i].onclick = function(){return false;};
elements[i].href = "#";
}
var elementsArea = document.getElementById('desc').getElementsByTagName('area');
for (var i = 0, len = elementsArea.length; i < len; ++i) {
elementsArea[i].onclick = function(){return false;};
elementsArea[i].href = "#";
}
</script>

  目前只知道a和area标签可以放href属性来进行跳转,不知道大家还知道有其它的方式可以用href跳转吗?

==========================================

(奇怪,不知道客户要这个效果做什么)

 

效果:

如果点击超链接,将正常导向;

如果按住Ctrl键并点击超链接,将执行一段JS代码,并且浏览器不会导向或打开新页面

 

<!--Work in IE 6.0/7.0 and FF 3.0-->
<href="#" onclick="if(event.ctrlKey){alert('Hello World!');return false;}window.location.href='http://www.google.com'";>google</a>

 

 


作者:Lance ZhangLance Zhang's Tech Blog
出处:http://blodfox777.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。



以前点某个链接希望停留在本页面的时候,往往会用href=“#”来做、今天学会了用onclick="return false;"
因为解释器是根据link的onclick方法的返回值来判断是否继续操作的。

这样就可以进一步提高javascript的兼容性,比如写一个弹出窗口就可以这样:
<a href = "http://www.iteye.com" onclick = "window.open(......); return false;">JavaEye</a>
这样支持javascript的用户可以看到弹出窗口,不支持的可以直接链接到页面。

在实际的测试中,firefox2可以实现,ie6不行。


=============================================
一个冠冕堂皇的理由来解释为什么 onclick 返回 false 之后就可以进行使链接失效:
onclick="return fn()" 与onclick"fn()"有什么区别?好像两个都可以调用吧?    
返回到哪里了关键????
这就像一个回调函数吧.?
返回给onclick?????
回调,越来越晕了,呵呵

这就像一个回调函数吧.?
onclick 方法的之行需要 事件告诉他 执行还是不执行

因为JAVASCRIPT在事件中调用函数时用return返回值实际上是对window.event.returnvalue进行设置。

而该值决定了当前操作是否继续。
当返回的是TRUE时,将继续操作。
当返回是false时,将中断操作。

而直接执行时。将不会对window.event.returnvalue进行设置
所以会默认地继续执行操作

当在 <a href="abc.htm" onclick="return add_onclick()">open</a> 中
如果函数 add_onclick() 返回 true, 那么 页面就会打开 abc.htm
否则, (返回 false), 那么页面不会跳转到 abc.htm, 只会执行你的 add_onclick() 函数里的内容. (add_onclick函数中控制页面转到 abc.htm除外)

而 <a href="abc.htm" onclick="add_onclick()">open</a>
不管 add_onclick() 返回什么值, 都会在执行完 add_onclick 后打开页面 abc.htm



不过注意: 这个使链接失效的代码是不是版本兼容的,也不是浏览器兼容的。
IE6 可以 ,IE7 不行。。。
FireFox 据说也不行。

分享到:
评论
3 楼 wgimperial 2012-10-31  
帮我解决了问题,谢谢LZ 
2 楼 快乐向日葵 2011-04-27  
huhuanqadn 写道
终于解决了我的问题,谢谢了,兄弟。

I'm a girl
1 楼 huhuanqadn 2011-04-25  
终于解决了我的问题,谢谢了,兄弟。

相关推荐

    ext session失效 页面跳转

    如果服务器返回的信息表示Session已经失效,EXT应用可以调用`Ext.util.NavigationModel.redirectTo`或`window.location.href`等方法,将页面重定向到登录页面。 在后端,开发者需要设置Session的生命周期和超时策略...

    让网页上的超链接失效,不能点击的js代码

    首先,我们需要在HTML文件的头部添加以下代码:&lt;meta http-equiv="Content-Language" content="zh-cn"&gt; 让网页上的超链接失效,不能点击 然后,我们需要添加以下CSS代码来选择所有的超链接:&lt;style&gt; a {poorfish:...

    [removed].href IE下跳转失效的解决方法

    本文将深入探讨一个常见的问题,即`window.location.href`在IE下跳转失效的问题及其解决方案。 `window.location.href`是JavaScript中的一个属性,用于获取或设置当前页面的URL。当你将其赋值为新的URL时,浏览器...

    页面刷新后CSS失效

    &lt;link rel="stylesheet" type="text/css" href="/path/to/ie-specific.css" /&gt; &lt;![endif]--&gt; ``` 6. **优化DOM结构**: - 确保动态生成的HTML片段具有清晰的DOM结构,并且能够正确地匹配到CSS选择器。 7. **...

    Springboot访问templates下的html页面,CSS,JS失效

    然而,有时在尝试访问`templates`目录下的HTML页面时,可能会遇到CSS和JavaScript失效的问题。这个问题通常是由于静态资源处理配置不正确或者路径引用不准确导致的。以下是一些可能的原因及解决方案: 1. **静态...

    JS中三种编码方式(escape,encodeURI,encodeURIComponent)

    在JavaScript(JS)中,对字符串进行编码是处理URL、非ASCII字符或准备数据传输时常见的操作。有三种主要的编码方法:`escape()`, `encodeURI()`, 和 `encodeURIComponent()`。它们各自有不同的应用场景和特点,下面...

    JS的location.href跳出框架打开新页面的方法

    今天遇到个问题,后面在框架中,当判断登录失效后要返回登录页面,但登录页面却在框架内打开,我想让它直接跳出框架打开(这里不是打开新窗口),终于在网上找到了办法,分享给大家: echo “[removed]alert&#40;...

    解决使用vue.js路由后失效的问题

    且之前用jquery写的一些效果也失效了.最后找到原因是因为同一个id被启动了两次(第一次是之前使用vue组件时启动的,另外一个是路由时启动的) 附上部分代码 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta ...

    ie,360下html锚点失效问题解决

    7. 使用$(window).scrollTop(t)让视窗滚动到指定位置,其中t是上一步得到的偏移量。 这段代码的原理是在页面加载完成后立即触发滚动操作,跳转到指定锚点位置。这种方法在解决IE和360浏览器中锚点失效问题时特别...

    引用css文件失效解决方法

    这种情况通常被称为“CSS文件失效”,这可能是由多种原因引起的。以下是一些常见的解决方法和可能导致CSS失效的因素: 1. **文件路径问题**:确保CSS文件的URL正确无误。如果CSS文件与HTML文件不在同一目录下,需要...

    ie6不兼容hover ie6 a hover属性失效解决办法

    首先,在a标签上添加href属性,不论其值为何(例如href="#"或者href="javascript:void(0);"),只要不是空字符串即可。接下来,就是确保在CSS中为带有href属性的a标签编写:hover状态下的样式。在实际操作过程中,...

    spring boot 2.x html中引用css和js失效问题及解决方法

    &lt;link rel="stylesheet" type="text/css" href="/resources/css/style.css"&gt; &lt;script type="text/javascript" src="/resources/js/script.js"&gt;&lt;/script&gt; ``` 确保路径前缀与application.properties中配置的路径匹配...

    IE6浏览器中[removed].href无效的解决方法

    在IE6浏览器中,开发者经常会遇到一个问题,那就是`window.location.href`无法正常工作,导致页面跳转失效。这个问题主要是由于浏览器的事件处理机制和默认行为的处理方式导致的。本篇文章将深入探讨这个问题的原因...

    Vue-resource拦截器判断token失效跳转的实例

    首先,让我们来了解什么是拦截器。在 Vue-resource 中,拦截器是一种机制,用于在发送 HTTP 请求之前或之后执行某些操作。拦截器可以用来实现身份验证、错误处理、日志记录等功能。 在我们的实例中,我们使用拦截器...

    使用Ajax时处理用户session失效问题的解决方法

    当用户session失效时,系统需要能够及时通知用户并引导他们重新登录。在使用Ajax技术进行异步数据交互时,传统的处理方式可能会失效,因为Ajax请求不会像普通HTTP请求那样自动处理服务器返回的重定向。本文将详细...

    使用 Python 清理收藏夹里已失效的网站

    正则匹配的部分使用了如下的模式:`pattern = r'href="(.*?)" rel="external nofollow" .*?&gt;(.*?)&lt;/A&gt;'`,这个模式用于匹配HTML中书签的链接和名称。 接下来,代码通过 `requests.get()` 函数访问每个匹配到的URL,...

    选择正确DOCTYPE解决CSS在网页失效问题

    检查`&lt;link&gt;`标签的`href`属性指向的CSS文件路径是否正确,以及文件是否存在。 3. 检查CSS代码的语法。确保CSS规则的书写符合W3C标准,避免使用已被废弃的属性或规则。 4. 测试浏览器兼容性。不同的浏览器可能对CSS...

    top.location.href 没有权限 解决方法

    如果用户的浏览器禁用了JavaScript或者有严格的隐私设置,这种方法可能失效。此外,如果目标网站对跨域请求有严格的CORS(跨源资源共享)策略,这种方法也无法成功。因此,开发者应当尽可能地优化他们的代码,以适应...

Global site tag (gtag.js) - Google Analytics