$("").click与onclick的区别示例介绍

时间：2022-07-31 03:54:21

Html代码：

<script type="text/javascript">

$(function(){

$("#btn4").click(function(){

$("#btn3").click();

});

});

function change(){

alert("onclick");

}

</script> 

<button id="btn3" onclick="change()">dd</button>

<button id="btn4">ee</button>

区别：

1.onclick是绑定事件，告诉浏览器在鼠标点击时候要做什么

click本身是方法作用是触发onclick事件，只要执行了元素的click()方法，就会触发onclick事件。如上诉代码所示，当点击 'ee'按钮时,会触发'dd'的onclick事件(正常来说得按'dd'按钮才触发'dd'的onclick事件)，原因就是因为

$("#btn4").click(function(){

$("#btn3").click();

});

点击'ee'按钮时,代码内部调用了'dd'的click()方法，从而触发了'dd'的onclick事件。

2.click()方法的主要作用是触发调用click方法元素onclick事件。此外，如果在click方法定义了如下代码

$("#btn3").click(function(){

alert("*****");

});

click方法中的function代码会在onclick事件执行完后执行，此时click方法起到追加事件的作用。实例如下

Html代码：

<script type="text/javascript">

$(function(){

$("#btn3").click(function(){

alert("aa");

});

});

function change(){

alert("bb");

}

</script>

<button id="btn3" onclick="change()">dd</button>

弹出框的弹出顺序先是'bb',然后是'aa'.

总结：click是jquery元素，onclick是DOM元素。

随机推荐

  1. 【BZOJ-4245】OR-XOR 按位贪心

    4245: [ONTAK2015]OR-XOR Time Limit: 10 Sec  Memory Limit: 256 MBSubmit: 486  Solved: 266[Submit][Sta ...

  2. java 引入自定义字体font后出现的硬盘吃光的问题

    有个需求要用美术字体在图片上写字 用自定义的文字有两个方法: 1. Font dynamicFont = Font.createFont(Font.TRUETYPE_FONT, InputStream ...

  3. 关于JS中的JSON

    早期,一般是使用XML作为互联网上传输结构化数据的,但由于它解析麻烦,字符冗长,因此被轻量级的JSON所逐渐替代.JSON是JavaScript的一个严格子集,利用了JavaScript中一些模式来表 ...

  4. NSBundle 的理解和 mainBundle

    http://www.360doc.com/content/15/0629/10/20918780_481405304.shtml

  5. ASP&period;NET 状态的传递和保存

    1,HTTP协议是无状态的.服务器不会记住上次给浏览器的处理结果,如果需要上次处理结果(上次状态)就需要浏览器把处理结果值(上次状态)再次给服务器. 2,URL传值:通过URL参数或者通过Form表单 ...

  6. Java对象的序列化与反序列化

    序列化与反序列化 序列化 (Serialization)是将对象的状态信息转换为可以存储或传输的形式的过程.一般将一个对象存储至一个储存媒介,例如档案或是记亿体缓冲等.在网络传输过程中,可以是字节或是 ...

  7. Properties文件，Data&comma;Calendar类的使用

    package cn.hncu.day9; import java.io.FileInputStream;import java.io.FileNotFoundException;import jav ...

  8. Redux架构

    深入Redux架构   阅读目录 关于redux API 中间件与异步操作 异步操作的基本思路 React-Redux的用法 回到顶部 关于redux 之前写了一篇通过一个demo了解Redux,但对 ...

  9. windows tomcat web应用以及eclipse console乱码解决方法

    在windows下,如果vm文件名为UTF-8格式,则显示乱码(velocity写出的不乱码): 改回GBK,则不再乱码.

  10. SQL语句的一些基本使用以及一些技巧

    #SELECT 列名1, 列名2, from 表明 #SELECT id,title,content,type from news 效率相对较高#SELECT * from news *代表所有字段, ...

相关文章