答案是:可以的,onclick事件可以调用多个方法,每个方法之间用分号(;)隔开即可。

onclick后面其实是可以写任何代码的,但是一般不建议这么写!!

例:onclick="fun1(); fun2(); fun3()"

小案例

最近在一本书里看到一个JavaScript图片库的例子,作者希望能留在这个网页而不是转到另一个窗口,结构如下:

将图片路径直接给到一个链接中,会遇到一个问题:

  触发点击事件,不仅会触发showPic函数,链接被点击的默认行为也会被调用,这样图片还是会在另一个窗口显示,不符合预期。

故,我们可以利用onclick后可接多个函数,传入一个阻止默认行为的函数去阻止链接的默认行为即可(如上图)。

javascript onclick事件可以调用两个方法吗?的更多相关文章

  1. javascript中onclick事件能调用多个方法吗

    Q: javascript中onclick事件能调用多个方法吗? A: 可以的,方法如下onclick="aa();bb();cc();"每个方法用“;”分号隔开就行了

  2. 动态生成的DOM不会触发onclick事件的原因及解决方法

    最近朋友在做一个项目的时候,遇到动态加载微博内容,然后点击“展开评论”后获取该微博的所有评论.这里使用了动态加载的<span mid='123456789′ class='get_comment ...

  3. c#中onclick事件请求的两种区别

    在C#中如果是asp控件的button有两个click的调用,一个是OnClick,一个是OnClientClick.那么这两者有什么区别呢,下面就来说说区别. <asp:Button ID=& ...

  4. js阻止事件冒泡的两种方法

    1.什么是JS事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这 ...

  5. WPF Loaded事件连续调用两次的问题

    最近开发的一套系统中,在检查开发成员的代码时候,在Loaded事件中加上以下语句: this.Loaded -= new RoutedEventHandler(***_Loaded);这让我觉得有些奇 ...

  6. JavaScript模板引擎artTemplate.js——两种方法实现性别的判定

    template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...

  7. javascript 实现字符串反转的两种方法

    第一种方法:利用数组方法 //先split将字串变成单字数组,然后reverse()反转,然后将数组拼接回字串 var str = "abcdef"; str.split(&quo ...

  8. JavaScript DOM事件对象的两个小练习 | 学习内容分享

    Event 对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 事件通常与函数结合使用,函数不会在事件发生前被执行! 本文用于记录个人学习过程 ...

  9. JavaScript的事件对象_其他属性和方法

    在标准的 DOM 事件中,event 对象包含与创建它的特定事件有关的属性和方法.触发的事件类型不一样,可用的属性和方法也不一样. 在这里,我们只看所有浏览器都兼容的属性或方法.首先第一个我们了解一下 ...

随机推荐

  1. HashMap不能使用基本数据类型作为key

    HashMap存储元素采用的是hash表存储数据,每存储一个对象的时候,都会调用其hashCode()方法,算出其hash值,如果相同,则认为是相同的数据,直接不存储,如果hash值不同,则再调用其e ...

  2. xshell 挪动文件夹

    cp -rp /home/d001 /home/Documents 复制/home下d001到/home下Documents -r 是遍历目录,即复制整个目录-p 是保留原有属性 查看的命令是cat ...

  3. boost string algorithm

    The Boost.StringAlgorithms library provides many free-standing functions for string manipulation. 1. ...

  4. 【基础】Maven生命周期

    Maven是一个优秀的项目管理工具,它能够帮你管理编译.报告.文档等. Maven的生命周期: maven的生命周期是抽象的,它本身并不做任何的工作.实际的工作都交由"插件"来完成 ...

  5. 数据中台核心方法论--OneModel为何需要产品化支撑?

    什么是产品化 大部分创业公司都是从一个伟大的想法创意开始的,并且需要有一堆技术专家来实现.我们清楚,伟大的技术并不等同于和伟大的产品,技术可以解决问题,但如果它没有办法法规模化,那这些技术或者能力对用 ...

  6. html{-webkit-text-size-adjust:none;}(取消浏览器最小字体限制)

    2016年10月13日 09:31:58 ITzhongzi 阅读数 9409   1.当样式表里font-size<12px时,中文版chrome浏览器里字体显示仍为12px,这时可以用 ht ...

  7. selenium IDE 安装环境配置

  8. HTML-参考手册: HTML 语言代码

    ylbtech-HTML-参考手册: HTML 语言代码 1.返回顶部 1. HTML 语言代码 参考手册 ISO 语言代码 HTML 的 lang 属性可用于声明网页或部分网页的语言.这对搜索引擎和 ...

  9. HTML5: HTML5 表单元素

    ylbtech-HTML5: HTML5 表单元素 1.返回顶部 1. HTML5 表单元素 HTML5 新的表单元素 HTML5 有以下新的表单元素: <datalist> <ke ...

  10. (54) C# 调用 kernel32.dll

    https://www.cnblogs.com/cwy173/archive/2010/10/02/1841321.html Kernel32 API AddAtom 向本地原子表添加一个字符串 Al ...