在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. react-native页面之间的相互传值

    react-native页面之间的相互传值 之前在自己学习react-native的时候,在页面跳转和传值问题上花了一段时间去网上搜索和查找资料,自己总结了两个方法.可以参考 https://blog ...

  2. mac下安装ngnix以及开启关闭重启

    一.安装 执行如下命令 brew search nginx brew install nginx 安装完以后,可以在终端输出的信息里看到一些配置路径: /usr/local/etc/nginx/ngi ...

  3. jacoco 的使用及与jenkins的集成

    1.把jacocoagent.jar的包放入到dockerfile COPY jacocoagent.jar /opt/jacoco/lib/jacocoagent.jar 2.打完镜像,需要启动容器 ...

  4. Robot Framework问题汇总...不断更新中

    在实际使用Robot Framework工具过程中,难免会遇到一些问题, 我们将会一一记录下来,以便后来者碰到类似的问题能够快速解决! 安装类问题: ========================= ...

  5. 洛谷 P3804 【模板】后缀自动机

    来一份模板 #include<cstdio> #include<algorithm> #include<cstring> #include<queue> ...

  6. 018 [工具软件]截图贴图注释 Snipaste

    Snipaste 是一个截图贴图工具,绿色免费.官方主页:https://zh.snipaste.com/. 三大功能: 1.截图,可以自动识别窗口的各元素,可以精准到像素调整截图区域大小. 2.贴图 ...

  7. 把List<Map<String,Object>>转成Map<String,Object>

    Map<String, Object> parmMap = new HashMap<String, Object>(); //定义一个用于存储强转后的Map List<M ...

  8. AJPFX区分this和super

    this和super的区别No.区别thissuper1操作属性this.属性:表示调用本类中的属性,如果本类中的属性不存在,则从父类查找super.属性:表示调用父类中的属性2操作方法this.方法 ...

  9. ASP.NET控件的ID，ClientID，UniqueId的区别

    一般情况下三者相同(没有父控件) ID:获取或设置分配给服务器控件的编程标识符.分配给控件的编程标识符. (可写) 设置服务器控件上的此属性可提供对服务器控件的属性.事件和方法的编程访问.Web 开发 ...

  10. iTOP4418开发板7寸屏幕Android系统下横竖屏设置

    Android系统屏幕旋转设置 平台: iTOP4418开发板+7寸屏幕 1. Androd4.4源码可以编译成手机模式和平板模式,讯为iTop4418 开发平台的Android系统默认编译为平板模式 ...