A标签中通过href和onclick传递的this对象实现思路

在blog的后台管理中允许为一个分类添加一个地址，但是不好添加onclick事件。想传递当前对象给一个函数，于是就将这个URL写成"Javascript:shoControlSidebar(this)"，可是结果发现这并不可行，传递过去的参数是一个对象，但是却得不到任何其他信息。我想得到的是innerText，而这个this并非指向它所在的A标签。

这是<a href="Javascript:shoControlSidebar(this)">和<a href="javascript:void(0)" onclick="shoControlSidebar(this)">不同的地方。

当使用onclick="shoControlSidebar(this)"的时候，解释器会给他包装一个匿名函数，变成了：


代码如下:

a.onclick = function anonymous()
{
shoControlSidebar(this);
}

这个this指的就是a这个对象，而使用href的方式时，由于是一个地址，这个this就无处可指了。


代码如下:

<a href="javascript:void(0);" onclick="test(this);">A标签测试</a>

代码如下:

想获取A 中的innerHTML
如果href="test(this);" 不但获取不到值，而且程序将退出，href引向不对。

代码如下:

function test(obj){
alert(obj);
//js
alert(obj.innerHTML);
//jquery
alert($(obj).html());
}

赞 (0)

相关推荐

  • a标签的href与onclick事件的区别详解

    onclick中javascript的区别一般没用到都没注意,但出错时才有些郁闷,看文本章解释如下: 以前一直很随意,后来看.net里的linkbutton似乎是用在<a href="javascript:fun();"...>的形式,今天用这种方式就遇到一些问题,摘网友的文章和我的结论放在下面: 1.链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接): 2.假设链接中同时存在 href 与 onclick,如

  • a标签的href和onclick 的事件的区别介绍

    1.onclick事件先执行,如果onclick事件返回一个false值则href不再执行. 2.href="#"默认页面到锚点#top所以页面有滚动条时会跳到最上面.最好的解决办法是href="javascript:void(0);". 3.href中的返回内容会冲掉当前页面的信息.

  • 详解Html a标签中href和onclick用法、区别、优先级别

    如果不设置 href属性在IE6下面会不响应hover.双击后会选中标签的父容器而非这个一a标签(IE下都存在这一问题). 代码如下 <a href="javascirpt:fn(this)"> <a onclick="fn(this)"> 假定我们有个fn方法,需要取到这个元素,第一个方法传入的this是空值. 所以,比较推荐的写法是 代码如下 <a href="javascript:void(0)" onclic

  • window.location.href = window.location.href 跳转无反应 a超链接onclick事件写法

    错误写法 , 主要是在 href="#"这里 复制代码 代码如下: 错误写法 , 主要是在 href="#"这里 脚本如下 复制代码 代码如下: if (data == "发送成功") {                    alert(data);                    window.location.href = window.location.href;                } 正确的写法  href 后面跟一个

  • A标签中通过href和onclick传递的this对象实现思路

    在blog的后台管理中允许为一个分类添加一个地址,但是不好添加onclick事件.想传递当前对象给一个函数,于是就将这个URL写成"Javascript:shoControlSidebar(this)",可是结果发现这并不可行,传递过去的参数是一个对象,但是却得不到任何其他信息.我想得到的是innerText,而这个this并非指向它所在的A标签. 这是<a href="Javascript:shoControlSidebar(this)">和<a

  • 详解A标签中href=""的几种用法

    众所周知,a标签的最重要功能是实现超链接和锚点.而且,大多数人认为a标签最重要的作用是实现超链接,今天我刚好碰到a标签的一种写法<a href="JavaScript:;"></a>,所以就来整理下a标签中href的几种用法. 一.js的几种调用方法(参考总结的) 1.a href="javascript:js_method();" 这是常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的hr

  • JS中append字符串包含onclick无效传递参数失败的解决方案

    append后面跟要添加的参数 <i class="fa fa-share pointer" aria-hidden="true" title="分享" onclick="share('${img.imgId}','${img.imgTitle}','${imgCover}','http://www.liuda.tv/selectedImg?imgId=${img.imgId}')"></i> 上面这段

  • JavaScript获得页面base标签中url的方法

    本文实例讲述了JavaScript获得页面base标签中url的方法.分享给大家供大家参考.具体如下: 如果网页中定义了base标签,我们可以通过js代码获得base的url地址 <!DOCTYPE html> <html> <head> <base id="htmldom" href="http://www.jb51.net/"> </head> <body> <p>Base UR

  • Ruby on Rails中MVC结构的数据传递解析

    Ruby on Rails中MVC结构的数据传递解析

    如果读者已经开发过基于 Rails 的应用,但对其 MVC 间的数据传递还有诸多困惑,那么恭喜您,本文正是要总结梳理 Rails 数据传递的方法和技巧.Ruby on Rails 3(以下统称为 Rails 3)是当前的主要发布版本,本文所述及的内容和代码都基于此版本. Rails 3 简介 Ruby on Rails 是一个 Ruby 实现.采用 MVC 模式的开源 Web 应用开发框架,能够提供 Web 应用的全套解决方案.它的"习惯约定优于配置"的设计哲理,使得 Web 开发人员

  • Asp.net后台把脚本样式输出到head标签中节省代码冗余

    最近在学习开发服务器控件,其它就少不了为控件注册js和css之类的资源文件,或者直接注册纯脚本样式.其中就遇到如下问题: 1.  注册的资源文件或纯脚本样式在生成的页面中都不在head标签中(当然这个不影响页面功能)   2. 一个页面使用多个一样的控件时,会出现重复输入(出现多余代码) 第一个问题说到底也不是什么问题,主要是看个人喜欢.在浏览器里查看页面源代码时,也许就成了问题了,源代码很不整洁,要是内容多时问题就更突出.本来想找脚本,却在head标签里找不到,只能到其它标签里找了.(不知道有

  • Vue中组件之间数据的传递的示例代码

    Vue中组件之间数据的传递的示例代码

    Vue中组件的作用域是隔离的,父组件中的数值子组件看不到!也就是说,用angular作比喻,组件的scope天生是scope:()的! 如果父组件需要往子组件中传数据,此时应该使用标签属性: <div id="app"> <my-compo c="886"></my-compo> </div> 子组件中,用props声明这个值即可.并且在template里面可以直接使用{{c}}来获得这个属性,而不需要写为{{this

  • JS和jQuery通过this获取html标签中的属性值(实例代码)

    废话不多说了,具体代码如下所示: <html> <head> <script type="text/javascript" src="jquery-1.10.2.min.js"></script> <script type="text/javascript"> /** JQUERY 通过当前标签属性名,获取属性的值 */ function attrsByJquery(obj){ var

随机推荐