在做1个简单功能的时候,行间事件这块发现了1个问题:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head> <body>
<a onclick="fn()">a标签</a>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
function fn(obj){
var t = $(this).text();
console.log("t:"+t);
}
</script>
</body>
</html>

  

打印不出来t。事实上,这样做获取不到元素,也就是说$(this)为空。很奇怪了,这种写法也经常见:

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head> <body>
<a>a标签</a>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$('a').click(function(){
var t = $(this).text();
console.log(t);
alert(t);
}) </script>
</body>
</html>

事实上,这种写法就能获取的到。

那行间事件怎么传this呢?如下:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head> <body>
<a onclick="fn(this)">a标签</a>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
function fn(obj){
var t = $(obj).text();
console.log(t);
alert(t);}
</script>
</body>
</html>

注意,函数的形参不能直接写this,因为this是一个关键字。$(obj)的作用是将原生的dom对象转换成jquery对象。这样可以很方便的进行操作了。

总结:第1种写法有问题,其他两种都可以。有时候事件写在行间方便点,因为动态语言生成页面的时候,传值很方便,除了this,我们还可以传后台的数据,jsp中比如:

<a onclick="createChild(${map2.id},${map2.parentid},'${map2.url}','${map1.menuname}')" >(修改)</a>。

这时候要在JavaScript要用到this,那么这样即可:

 <a  onclick="createChild(${map2.id},${map2.parentid},'${map2.url}','${map1.menuname}',this)" >(修改)</a>

不用this的时候把事件写在外面,本文中第二种写法。

行间事件传this的问题:的更多相关文章

  1. P21_事件传参与数据同步

    事件绑定 在事件处理函数中为 data 中的数据赋值 通过调用 this.setData(dataObject) 方法,可以给页面 data 中的数据重新赋值,示例如下: 事件传参 小程序中的事件传参 ...

  2. 【JS学习笔记】提取行间事件

    行间提取事件第一种方法: function 名字() { ... } oBtn.onclick=名字: 第二种方法: oBtn.onclick=function () { ... } 其实在JS当中, ...

  3. react事件绑定,事件传参,input单向数据绑定

    import React, { Component } from 'react'; class New extends Component { constructor(props){ super(pr ...

  4. wpf 用户自定义事件传参2

    public delegate void MenuButtonClickEventHandler(object sender, EventArgs e); public event MenuButto ...

  5. 微信小程序:bindtap等事件传参

    事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 id, data ...

  6. 微信小程序开发小技巧——单击事件传参、动态修改样式、轮播样式修改等

    一. 脚本部分: 1. 表达式无效的处理: 如果你发现自己编写的表达式无效或者数据不展示,那么请先检查你的表达式是否有添加{{}},小程序中全部都要添加的,只要是在模板中调用js中的数据 2. 获取元 ...

  7. wpf 用户自定义事件传参

    //自定义传参 ,对外联系的参数 public class ImageZoomChangedEventArgs : RoutedEventArgs { /// <summary> /// ...

  8. 微信小程序 - bindtap等事件传参

    什么是事件事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 id, ...

  9. Vue 下拉框值变动事件传多个参数

    在使用 Vue 进行开发时,下拉框值变动事件 @change 是很常用的. 其传参一般分为两种方式:默认传参和自定义传参. 默认传参 @change 默认会传选中项标识的参数,在传参处不用定义,在方法 ...

随机推荐

  1. open-ldap服务安装(1)

    LDAP简介 LDAP 代表 轻量级目录访问协议.在我的理解中ldap就是一个数据库. 在LDAP中,目录条目以分层树状结构排序. 传统上,这种结构反映了地理和组织边界,表示国家/地区的条目显示在树的 ...

  2. 【ACM】hdu_1004_Let the Balloon Rise

    Let the Balloon Rise Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Oth ...

  3. 关于Dos窗体的设置

    1.输入cmd,点击回车键.出现下图: 2.点击左上角(红框框起来的地方),进行例如以下图操作: 3.选择"属性",出现下图: 4.选择"字体"能够改动字体的大 ...

  4. mysql配置文件夹错误:在安装mysql 5.6.19 时运行cmake命令是出现CMake Error: The source directory does not appear to contai

    在安装mysql 5.5.xx 时运行cmake命令是出现CMake Error: The source directory does not appear to contain CMakeLists ...

  5. Chrome Extension 的 webRequest模块的解读

    Chrome Extension 的 webRequest模块的解读   文档在此:http://developer.chrome.com/trunk/extensions/webRequest.ht ...

  6. 数据库技术_Orcale技术(0002)_5分钟会用存储过程_存储过程实例

    基础技术: 样例业务功能: 1.依据传入的类型A_TYPE联合查询PROCEDURE_TEST_A表.PROCEDURE_TEST_A_SUB表中的数据.并显示主要内容. 2.依据传入的类型A_TYP ...

  7. ES Segment Memory——本质上就是segment中加到内存的FST数据,因此segment越多,该内存越大

    ElasticSearch优化系列四:ES的heap是如何被瓜分掉的 转自:https://www.jianshu.com/p/f41b706db6c7 以下分别解读几个我知道的内存消耗大户: Seg ...

  8. The Unique MST--hdoj

    The Unique MST Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 20000/10000K (Java/Other) Tota ...

  9. linux git保存用户名密码(避免每次push输用户名密码)

    Linux/Unix/Mac 系统 新建一个 ~/.netrc 文件, 将 git 服务器, 用户名以及密码记录在这个文件, 如下所示:   machine your-git-server   log ...

  10. [C#] override和overload的区别

    重载应该叫overload,重写叫override:重载某个方法是在同一个类中发生的!重写是在子类中重写父类中的方法. 1.override:   父类:public virtual string T ...