`
mandel19
  • 浏览: 29114 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

HTML 中各浏览器对A标签中javascript的支持

阅读更多
最近做一个项目要求javascript对多浏览器支持,但是页面中有较多的使用A标签,于是就出现了下面的问题

如写出下面的代码

<a href="javascript:;" onclick="testFunction()">测试</a>


对于上面的代码,各个浏览器的支持分别为:

IE6/IE7:  会执行onclick中的javascript方法,但同时也会执行href中的javascript方法,于是,如果你在onclick方法中提交了表单,那么就会出现表单提交了,但是页面没有跳转的问题!

IE8:  和 前两个版本IE一样,href中的javascript方法会执行,同时onclick方法也会执行,但是不同点是如果onclick中提交了表单,页面可以跳转

firefox和webkit浏览器:这两个浏览对于上面的A标签执行的方式和IE8是一样!

针对上面的问题,其实是由于上面的A标签中使用的javascript语法不正确所致

对于上面的A标签,IE6和IE7中会先执行href然后再执行onclick,所以按上面的语法就会变成先执行了javascript: ;这个方面,IE6会认为是页面刷新了!所以当onclick方法中有跳转时,方法执行完后不会跳转,因为前面的javascript: ;相当于已经让浏览器跳转了一次页面,所以无法执行跳转!

针对上面的解决方法可以用下面的方式

<a href="javascript:void(0);" onclick="javascript: testFunction(); return false;">test</a>


这种是目前来说最标准的写法

不过这样写代码又确实有点长了,所以也可以写成下面的比较懒的写法

<a href="#" onclick="javascript: testFunction(); return false;">test</a>


最关键是要在onclick中reutnr false;告诉浏览器不要去执行A标签中的href方法
分享到:
评论

相关推荐

    C# 浏览器完整版开发,支持视频、JS交互

    浏览器标签、HTML页面能播放视频、下载记录、JS交互(能调用原生相机、调用VLC集成能力:流视频播放)、软件更新、自定义右键菜单、F11全屏模式、F12调试模式、F5刷新、ALT+F5强制刷新、系统配置等功能、网络请求...

    JavaScript代码应该放在HTML代码哪个位置比较好?

    但放置的地方,会对 JavaScript 代码的正常执行会有一定影响,具体如下所述。 放置于&lt;head&gt;&lt;/head&gt;之间 将 JavaScript 代码放置于 HTML 文档的 &lt;head&gt;&lt;/head&gt; 标签之间是一个通常的做法。...

    HTML+CSS+JavaScript 400源码套装.rar

    HTML标签是由尖括号包围的关键字,比如&lt;html&gt;,HTML标签通常是成对出现的,比如&lt;b&gt;&lt;/b&gt;,标签对中的第一个标签为开始标签,第二个标签为结束标签,开始标签和结束标签也被称为开放标签和闭合标签 HTML注释: &lt;!–...

    让audio和video标签在任何浏览器中都兼容html5media.min.js

    HTML5新增加的audio和video标签让我们增加了很多惊喜,可以让我们...但目前很多浏览器不支持,无法在旧版的IE浏览器中使用。html5media.min.js却是一个能让这两个标签在各种新旧版IE浏览器中全面兼容的JavaScript类库。

    报错:Uncaught SyntaxError: Cannot use import statement outside a module 详解

    HTML 网页中,浏览器通过 script 标签加载 JavaScript 脚本。由于浏览器脚本的默认语言是 JavaScript,因此type=”application/javascript”可以省略。在报错中了解到,是说无法在模块外部使用import语句,因为...

    使用js检测浏览器是否支持html5中的video标签的方法

    主要介绍了使用js检测浏览器是否支持html5中的video标签的方法,需要的朋友可以参考下

    微软开源的JavaScript引擎 ChakraCore.zip

    ChakraCore 是微软开源的 Microsoft Edge 浏览器 Chakra JavaScript 引擎的核心部分,主要用于 Microsoft Edge 和 Windows 中 HTML/CSS/JavaScript 编写的应用。ChakraCore 支持 x86/x64/ARM 架构 JavaScript 的 ...

    100个直接可以拿来用的JavaScript实用功能代码片段(1-10)

    22、原生JavaScript中兼容浏览器绑定元素事件 23、原生JavaScript光标停在文字的后面,文本框获得焦点时调用 24、原生JavaScript检验URL链接是否有效 25、原生JavaScript格式化CSS样式代码 26、原生JavaScript压缩...

    仿Google页面效果完美版源码(HTML+JavaScript)

    完美的仿Google页面效果,方便用户体验,还美观。用HTML+JavaScript实现,很容易调用。跟大家共享一下。

    video:一个基于浏览器的视频播放器,它利用 HTML5 视频标签和纯 Javascript 来控制事件。 这些代码改编自分散在互联网上的众多来源

    视频 一个基于浏览器的视频播放器,它利用 HTML5 视频标签和纯 Javascript 来控制事件。 这些代码改编自散布在互联网上的众多来源。 只需克隆存储库并从浏览器运行它

    用JavaScript来美化HTML的select标签的下拉列表效果

    主要介绍了用JavaScript来美化HTML的select标签的下拉列表效果的方法,而且在多浏览器下的兼容效果也得到提升,需要的朋友可以参考下

    JavaScript语言参考手册

    显然,用户界面可能在先前版本的浏览器中有些不同。 JavaScript 应用程序可在许多操作系统中运行;此处的信息应该适用于所有版本。文件和目录路径是以 Windows 格式 (用反斜线分隔目录名) 给出的。对于 Unix 版本,...

    最好用的手机浏览器欧朋手机浏览器安卓版Android

    支持包括HTML5、CSS、JavaScript、SVG等在内的多种互联网标准,以最丰富的色彩为您呈现全部互联网网页。 智能缩放 点击网页可自动放大,放大后内容将自动调节至屏幕宽度,让您无需左右滚动便可快捷浏览。如果手机支持...

    欧朋手机浏览器Opera mini官方Java版

    支持包括HTML5、CSS、JavaScript、SVG等在内的多种互联网标准,以最丰富的色彩为您呈现全部互联网网页。 智能缩放 点击网页可自动放大,放大后内容将自动调节至屏幕宽度,让您无需左右滚动便可快捷浏览。如果手机支持...

    欧朋手机浏览器官方下载Java版

    支持包括HTML5、CSS、JavaScript、SVG等在内的多种互联网标准,以最丰富的色彩为您呈现全部互联网网页。 智能缩放 点击网页可自动放大,放大后内容将自动调节至屏幕宽度,让您无需左右滚动便可快捷浏览。如果手机支持...

    HTML页面不认标签,怎么办?

    也许有的中级前端知道type=text/template标签,所以在这里我就不解释他的用处了,你能找到我这里来,说明你已经遇到这个问题了....以上代码,HTML浏览器不能解析,报错. 怎么办? 我来教给你如何变相的让他认这个type.

    libsignal-protocol-javascript-example:有关“如何使用libsignal-protocol-javascript?”的示例

    请注意,由于标签页共享localStorage ,因此无法使用同一浏览器中的多个标签页。 尝试使用其他浏览器或专用/隐身Windows /制表符。libsignal-protocol.js中的更改libsignal-protocol.js在调用storage....

    可以自动控制网页操作的浏览器MutouBrowser(Pro).rar

    木头多功能浏览器(专业版)可以生成自动刷新网页监控网页...11、支持自动打开、关闭浏览器标签页,浏览器自动前进后退功能; 12、浏览器自动执行自定义javascript或jquery代码。 13、可以完成复杂的网页自动控制流程。

    欧朋手机浏览器Opera mini官方安卓版

    支持包括HTML5、CSS、JavaScript、SVG等在内的多种互联网标准,以最丰富的色彩为您呈现全部互联网网页。 智能缩放 点击网页可自动放大,放大后内容将自动调节至屏幕宽度,让您无需左右滚动便可快捷浏览。如果手机支持...

    JavaScript源代码集

     在这儿你只要在传统 <a&gt; 的标签中加入 onMouseOver 的 method 就可达成你要的效果了。这里的 window.status 是用来让你可以在 WWW 浏览器的状态列上显示一些讯息用的。  在语法中,你可以看到讯息部分是用 ’...

Global site tag (gtag.js) - Google Analytics