在script中有几种绑定事件的方法，有的在绑定函数中传入this参数，有的没有，那么，它们之间到底有什么区别呢？

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<form action="/index.html" method="post">

    {% csrf_token %}

    <input type="text" name="username"/>

    <a onclick="submit()">提交</a>

    <a onclick="submit1(this)">提交</a>

    <a id="fm">提交</a>

</form>

<script src="/static/js/jquery-3.3.1.min.js"></script>

<script>

    /*

     绑定事件中this的用法

    */

    function submit() {

        console.log(this)

    }

    /*

     如果以此种方式绑定事件，括号中不传入this参数，那么this在这里代指的就是整个doucumeng对象

     */

    
　  function submit1(ths) {

        console.log(ths)

    }

     /*

     如果以此种方式绑定事件，括号中传入this参数，那么this在这里代指的就是当前标签对象

    */

　  $('#fm').click (function submit3() {

         console.log(this);

     });

 /*

        找到当前标签

   如果以此种方式绑定事件，括号中不传入this参数，那么this在这里代指的就是当前标签对象

    */

</script>

</body>

</html>

javascript中点击事件传入this的用法的更多相关文章

  1. Javascript中点击（click）事件的3种写法

    方法一 <!DOCTYPE html> <html> <head> <title>Javascript中点击事件方法一</title> &l ...

  2. JS中点击事件冒泡阻止

    JS中点击事件冒泡阻止 解析: 一个div层'out',内含有一个div层'in'.如下: 两个层都绑定了点击事件,但是点击in层的时候,点击事件会出现冒泡现象,同时也会触发out层的点击事件. 但是 ...

  3. Android中点击事件的四种写法详解

    Android中点击事件的四种写法 使用内部类实现点击事件 使用匿名内部类实现点击事件 让MainActivity实现View.OnClickListener接口 通过布局文件中控件的属性 第一种方法 ...

  4. js for循环中点击事件中无法获取每一个i值的问题

    好像是第二次遇到这个问题,必须要总结一下!! <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

  5. CSS伪类选择器active模拟JavaScript点击事件

    一.说明 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式. IE7及更早浏览器只支持a元素的:active,从IE8开始支持其它元素的:active. 另:如果需要给超链接定义:访问前 ...

  6. JavaScript点击事件-一个按钮触发另一个按钮

    <input type="button" value="Click" id="C" onclick="Go();" ...

  7. JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题

    javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...

  8. 【javascript】iOS Safari 中点击事件失效的解决办法

    问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, span 等),此时 click 事件会失效. ...

  9. JavaScript点击事件——美女合集

    Js点击事件--美女合集 实例 效果如下图: 代码如下: <!DOCTYPE html> <html lang="en"> <head> < ...

随机推荐

  1. 洛谷P4374 [USACO18OPEN]Disruption（树链剖分+线段树）

    传送门 不难发现,每一条额外修的路径,会对原树上$(u,v)$路径上的所有边产生贡献 于是这就变成了一个路径修改 那么我们把每一条边赋值到它连接的两个点中深度较大的那个上面,然后每一次用树剖+线段树做 ...

  2. web项目tomcat启动url自定义（去掉项目名）

    通常,使用maven构建web项目,启动时默认的访问路径: http://ip:port/项目名 很多时候我们不喜欢这样 访问,我们希望下面的访问方式: http://ip:port 如果是本地的to ...

  3. 图论/位运算 Codeforces Round #285 (Div. 2) C. Misha and Forest

    题目传送门 /* 题意:给出无向无环图,每一个点的度数和相邻点的异或和(a^b^c^....) 图论/位运算:其实这题很简单.类似拓扑排序,先把度数为1的先入对,每一次少一个度数 关键在于更新异或和, ...

  4. [转]Asp.net Mvc2中重构View的三种方式

    本文转自:http://www.cnblogs.com/zhuqil/archive/2010/07/14/asp-net-mvc2-view-refactoring.html 我们在Asp.net ...

  5. 程序猿工具——svn

    一个项目的产生,都需要团队中的开发人员互相协作.它的简单,方便深深吸引了我. svn的使用,有2部分组成--svn服务器.svn客户端.svn服务器一般团队之间只要有一个安装就可以了. 在学习安装sv ...

  6. 【Hibernate】多对多关系的表达

    User.hbm.xml <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE hibernate ...

  7. Java文件上传（基础性）

    /** * * 上传文件 * */ public class FileUploadServlet2 extends HttpServlet { protected void doGet(HttpSer ...

  8. Struts2------拦截器和标签库和注解开发

    一.解析Struts2源码中拦截器的执行 客户端请求Action,执行前端控制器,在前端控制器内部创建了Action的代理类,调用代理类的execute方法,在execute方法内部执行ActionI ...

  9. Node.js——路径问题

    相对路径问题:读取文件,形如 ./ 或者 ../  一般认为这个点是相对于这个 js 文件的文件夹路径,实际上不是,这个点相对于node命令时的当前路径,不同 js 文件下进行 ./  这样的引入是不 ...

  10. Farseer.net轻量级开源框架 中级篇：探究ORM(Mapping)

    导航 目   录:Farseer.net轻量级开源框架 目录 上一篇:Farseer.net轻量级开源框架 中级篇: SQL执行报告 下一篇:Farseer.net轻量级开源框架 中级篇: Cooki ...