`
jaroddang
  • 浏览: 32444 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JavaScript Onclick Return False

阅读更多
本文译者注
      下面的一小段文章,说明了在HTML标签中加入带有返回值的Onclick事件,当返回值为false时,对原标签的影响。在文章最后一段用到了Prototype,很遗憾本人并没有使用过此框架,翻译的可能有失准确。   
      这是本人第一次翻译文章,英文水平,JS水平均有限,也只是练习性质的翻译,如有不妥之处,感谢留言相告。
 

 

在HTML代码中,无论你在哪里放置了onclick事件,并且返回值为false时,那么该处的默认行为将不会执行。这里的默认行为是指没有Onclick事件时原本的行为。

 

举一个例子:

 

<a href="http://www.nojs.com" onclick="doSomething(); return false;">Click Me</a>

在上面的例子中,如上面所说点击(click)这个链接,那么动作进行将会截止到doSomething()函数全部完成,而并不会继续跳转到"http://www.nojs.com"(除非IE等浏览器端禁用了JavaScript)。

 

为了让上面的例子继续进行下一步,我们可以放置一个confirm函数强迫用户去决定他们是否愿意继续跳转,如果用户选择“是”,那么函数返回ture,页面跳转到“http://www.nojs.com”。

如下面这个例子:

<a href="http://www.nojs.com" onclick="return confirm('Are you sure you want to do that?');">Click Me</a>

 

最后还有个小技巧,当我用AJAX或触发一个div时,出现了一个让我恼火的情况,我点击了链接并且click事件已经完成,虽然链接没有跳转但还是变成了还是被选中过的颜色。虽然这无关紧要,但还是有一个办法可以不让这个发生,简单的说,可以模糊(blur)这个焦点让他看上去不是焦点

 

来看一个简单的例子:

<a href="" id="bjd" onclick="Element.toggle('MyDiv'); $('bjd').blur(); return false;">Toggle MyDiv</a>

 在上面这个例子里使用了prototype,如果你不了解prototype,你可以访问这个链接来了解一下Prototype

 

原文地址

http://www.bradino.com/javascript/onclick-return-false/

分享到:
评论
1 楼 wuyufeixue 2011-06-03  
  写的不错

相关推荐

    JavaScript中return false的用法

    在JavaScript编程中,`return false`是一个非常常用的语句,尤其是在事件处理中。本文将详细探讨`return false`的用法,以及它在防止默认事件行为方面所起的作用。 首先,需要明确的是,`return false`通常出现在...

    js中return false(阻止)的用法.docx

    ### JavaScript中`return false`的使用详解 #### 一、`return false`的基本概念与作用 在JavaScript中,`return false`通常用于阻止事件的默认行为。当一个事件发生时,浏览器通常会执行一系列默认操作。例如,...

    js中return false(阻止)的用法

    在JavaScript编程中,`return false`是一个经常被用来阻止默认动作和事件冒泡的关键字。它是`return false;`语句的简写形式,作用于函数或事件处理程序中,可以取消对象的默认动作并阻止事件继续传播。在处理表单...

    javascript实现删除前弹出确认框

    &lt;a href="" onclick="javascript: return del();"&gt;删除 ``` 在实际开发中,有时候需要更灵活的处理。比如,当删除操作关联到某个链接或按钮时,我们可以直接在该元素的`onclick`事件处理器中调用`del()`函数,并...

    Javascript中的return作用及javascript return关键字用法详解

    在HTML元素的`onClick`属性中,如果`return`后的函数返回`false`,那么默认的事件行为(如链接的跳转)将会被阻止: ```html &lt;a href="abc.htm" onclick="return confirm('确认打开链接吗?')"&gt;Open ``` 在上述代码...

    完美实现js拖拽效果 return false用法详解

    例如,点击链接时默认会跳转到href指定的地址,但如果我们希望阻止这个跳转,可以在`onclick`事件中使用`return false`。 2. **中断事件冒泡**:在事件冒泡模型中,事件会从最深的节点向上冒泡到父节点。`return ...

    浅谈javascript中return语句

    &lt;div id="child" onclick="return false;"&gt;点击我 document.getElementById('parent').addEventListener('click', function() { console.log('Parent clicked'); }); document.getElementById('child')....

    用javascript 禁止右键,禁止复制,禁止粘贴

    return false; }; ``` 这样,当用户尝试复制网页内容时,将出现提示框,禁止用户复制。 三、禁止粘贴 使用 JavaScript 也可以禁止用户粘贴内容到网页中。例如,可以在 `&lt;body&gt;` 和 `&lt;/body&gt;` 之间加入以下语句...

    浅析javascript的return语句

    JavaScript中的return语句是函数内用来结束函数执行并将值返回给调用它的代码的关键关键字。除了返回函数计算的结果之外,return语句还有一些特殊用法,如控制事件处理的结果。下面详细地介绍return语句的功能和使用...

    JavaScript中return用法示例

    在JavaScript中,`return`语句扮演着至关重要的角色,它是函数执行过程中的一个控制流关键字,用于从函数中返回一个值或结束函数的执行。本篇将详细探讨`return`的用法,以及它在实际编程中的应用场景。 首先,`...

    JavaScript+快捷键设置

    这里通过设置`keyCode`为0,并且将`returnValue`设为`false`来阻止其默认行为。 - **Ctrl+N**:禁止使用Ctrl+N的默认行为(新建新窗口)。 - **Shift+F10**:禁止使用Shift+F10的默认行为。 - **Shift + 鼠标点击...

    JavaScript经典代码大全

    2. 阻止选取和复制:`&lt;body onselectstart="return false"&gt;` 可以防止用户在页面上选取文本,`onpaste="return false"` 和 `oncopy="return false"; oncut="return false;"` 则分别禁止了剪贴板的复制和剪切功能。 ...

    Javascript

    使用 `oncontextmenu="window.event.returnValue=false"` 可以彻底屏蔽鼠标右键。 2. 取消选取、防止复制 使用 `&lt;body onselectstart="return false"&gt;` 可以取消选取和防止复制。 3. 不准粘贴 使用 `onpaste=...

    JavaScript常用代码集锦

    if (r == null) return false; var d = new Date(r[1], r[3] - 1, r[4]); return (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d.getDate() == r[4]); } ``` - **日期时间格式验证(YYYY-MM-DD...

    JavaScript 经典代码大全

    2. `&lt;body onselectstart="return false"&gt;`:此代码可以阻止用户在页面上的文本选择,防止内容被复制。 3. `onpaste="return false"`:这行代码禁止了在文本输入框或其他元素中粘贴内容的功能。 4. `oncopy=...

    javascript注册验证实例

    return false; } else { $("username_span").style.display = "none"; return true; } } ``` - **函数说明**:此函数用于验证用户名是否为空或只包含空格。 - **实现方式**:通过正则表达式删除前后空格,并...

Global site tag (gtag.js) - Google Analytics