在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. bzoj2720: [Violet 5]列队春游（概率期望+组合数学）

    Description Input Output Sample Input   Sample Output   HINT 数学题都这么骚的么……怎么推出来的啊……我是真的想不出来…… 首先,要算总的视 ...

  2. postgreSQL 创建user表时引发的表名大写与双引号问题

    在postgreSQL里面,user是一个保留字. 如果你想创建user表,你可能会遭遇一些问题! 如图: 可以看到,这里是无法创建user表的. 你可能会说,我只是没有加双引号"" ...

  3. WIN32 API ------ 最简单的Windows窗口封装类

    1 开发语言抉择 1.1 关于开发Win32 程序的语言选择 C还是C++ 在决定抛弃MFC,而使用纯Win32 API 开发Window桌面程序之后,还存在一个语言的选择,这就是是否使用C++.C+ ...

  4. [poj2096] Collecting Bugs【概率dp 数学期望】

    传送门:http://poj.org/problem?id=2096 题面很长,大意就是说,有n种bug,s种系统,每一个bug只能属于n中bug中的一种,也只能属于s种系统中的一种.一天能找一个bu ...

  5. 对比度受限的自适应直方图均衡化(CLAHE)

    直方图均衡化(HE)是一种很常用的直方图类方法,基本思想是通过图像的灰度分布直方图确定一条映射曲线,用来对图像进行灰度变换,以达到提高图像 对比度的目的.该映射曲线其实就是图像的累计分布直方图(CDF ...

  6. C. Unfair Poll 数学题，

    http://codeforces.com/contest/758/problem/C 需要一个能够找到任意一个位置的步数的方法,就能解决三个问题. 预处理出one(row, col)表示第一次经过这 ...

  7. C#过时方法标记

    1.当遇到过时或废弃的方式 函数怎么办 [Obsolete]特性解决你的困惑 1.1:当方法已经完成相关兼容 可以保留时

  8. Retrofit2.0动态url遇到的坑

    1.今天在升级基于RxJava2+Retrofit+RxCache的网络请求封装这套框架的过程中遇到一个问题,当我使用Post动态传入url时,服务器一直返回http404 ,我的请求地址末端是这样的 ...

  9. QT入门学习

    第一个QT程序 #include<QApplication> #include<QDialog> #include<QLabel> #include<QTex ...

  10. eclipse设置Tomcat超级详细

    刚接触Ajax,创建了jsp文件发现错误 必备软件:tomcat(从apache的官方网站上下载一个,我的是apache-tomcat-8.0.28) 需要下载tomcatPluginV321.zip ...