前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >javascript中onclick(this)用法和onclick(this.value)用法介绍

javascript中onclick(this)用法和onclick(this.value)用法介绍

作者头像
全栈程序员站长
发布于 2022-07-08 01:35:52
发布于 2022-07-08 01:35:52
1.9K00
代码可运行
举报
运行总次数:0
代码可运行

onclick(this.value)代码详解

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<html>  
<head>  
<script language="javascript">  
function test(value){  
        if(value=='1') {  
                alert("11111111");  
        }else{  
                alert("00000000");  
        }  
}  
</script>  
</head>  

<body>  
<form name="form1" method="post" action="">  
  <input type="radio" name="ra" value="1" οnclick="test(this.value)"/>  
  个人  
  <input type="radio" name="ra" value="0" οnclick="test(this.value)""/>  
  公司  
</form>  
</body>  
</html> 

2.onclick(this)代码详解 一般标签中会使用href和onclick两种方式来进行进行页面跳转或执行动作,但是小编一般都会使用onclick来进行执行Ajax函数进行跳转,并同时使用οnclick=”xxxxxx(this)”来传递动态参数:例子如下

JSP代码如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<a href="javascript:void(0);"  οnclick="xxxx(this)" userId=${userId}>${userName}></a> 

Js代码如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function  xxxx(obj) {  
    var thisObj=$(obj);//js对象转jquery对象  
    var userId=thsiObj.attr("userId");  
    alert(userId);  
}  

一般会将href写为“javascript:void(0)” 而不是“#”,因为可以防止不必要的页面跳动; 而this指的就是a标签这个对象

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/112694.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021年11月,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
事半功倍系列 javascript
清华大学出版的《事半功倍系列javascript》,本人照着书敲出来的,有些翻译了一下.前几年看了JavaScript
Java架构师必看
2020/07/21
3770
通过JavaScript用一些键值对来模拟表单控件
利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()方法来异步的提交这个”表单”。比起普通的ajax, 使用FormData的最大优点就是我们可以异步上传一个二进制文件。 语法:
用户7718188
2021/10/07
3590
ClientScriptManager.RegisterStartupScript.
当我们要注册一个在页面启动的脚本时,我们会用ClientScriptManager.RegisterStartupScript 。
全栈程序员站长
2022/09/09
4250
asp.net中Session小例子
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/159514.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/19
9730
asp.net中Session小例子
javascript验证email
<html> <head> <title>test</title> <script language="javascript"> function emailCheck () { var emailStr=document.all.form1.tel.value; alert(emailStr); var emailPat=/^(.+)@(.+)$/; var matchArray=emailStr.match(emailPat); if (matchArray==null) {  alert("电子邮件地址必须包括 ( @ 和 . )")  return false; } return true; } </script> </head>
Java架构师必看
2021/03/22
1.1K0
javascript中间preventDefault与stopPropagation角色介绍
我们知道,例如,<a href=”http://www.baidu.com”>百度</a>,这是html最基本的东西,的作用是点击链接百度上http://www.baidu.com,这是属于<a>标签的默认行为。
全栈程序员站长
2022/07/06
3690
Javascript中最常用的55个经典技巧(转)
1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键  <table border oncontextmenu=return(false)><td>no</table> 可用于Table  2. <body onselectstart="return false"> 取消选取、防止复制  3. onpaste="return false" 不准粘贴  4. oncopy="return false;" oncut="return fal
阿豪聊干货
2018/08/09
5050
总结收藏的41个JavaScript实用技巧
在文件的根目录放进去这个图片,后缀修改成ico就可以了 6. 可以在收藏夹中显示出你的图标
csxiaoyao
2019/02/18
1.5K0
[Java面试九]脚本语言知识总结.
核心内容概述 1.JavaScript加强,涉及到ECMAScript语法、BOM对象、DOM对象以及事件。 2.Ajax传统编程。 3.jQuery框架,九种选择器为核心学习内容 4.JQuery UI插件 5.jQuery Ajax编程 6.jQuery第三方插件 7.反向Ajax编程(彗星) 一、JavaScript基础加强 JavaScript是在浏览器内容运行,无需编译、解释执行动态脚本语言,是一种弱类型语言,所有变量使用var定义。 JavaScript的3个组成部分分别为:核心(ECMAScr
一枝花算不算浪漫
2018/05/18
5.2K0
JS起步阶段随笔【JavaScript】
只能放到标签里用,this 要时刻紧靠着它自己的环境,在函数内部可以用this,在标签内可以用,拿出去以后,就达不到想要的效果了,因为它所属的环境变了。
来杯Sherry
2023/05/25
5550
Web阶段:第五章:JQuery库
点击:API文档下载 Jquery介绍 1.什么是JQuery ? jQuery,顾名思义,也就是JavaScript和查询(Query),它就是辅助JavaScript开发的js类库。 2.JQue
Java廖志伟
2022/09/28
26.5K0
Web阶段:第五章:JQuery库
JavaScript学习笔记(一)
wdm,这个寒假越过越长… 寒假在家学习JavaScript的相关知识,写博客作为笔记 我是以清华大学出版社的《JavaScript从入门到项目实践》作为学习用书的
wsuo
2020/07/31
3.3K0
JavaScript学习笔记(一)
day03_js学习笔记_03_js的事件、js的BOM、js的DOM
day03_js学习笔记_03_js的事件、js的BOM、js的DOM ============================================================================= ============================================================================= 涉及到的知识点有: 五、js的事件 1、js的常用事件 onclick
黑泽君
2018/10/11
28.3K0
HTML中的setCapture和releaseCapture使用介绍
setCapture函数的作用就是将后续的mouse事件都发送给这个对象,releaseCapture就是将鼠标事件还回去,由 document、window、object之类的自行来处理。这样就保证了在拖动的过程中,不会由于经过了其它的元素而受到干扰 – 另外,还有一个很重 要的事情是,在Win32上,mouse move的事件不是一个连续的,也就是说,并不是我们每次移动1px的鼠标指针,就会发生一个mousemove,windows会周期性检查mouse 的位置变化来产生mousemove的事件。 所以,如果是一个很小的页面对象,比如一个直径5px的圆点,如果没有setCapture和 releaseCapture,那么在鼠标按住之后,快速的移动鼠标,就有可能鼠标移动走了,但是小圆点还在原地,就是因为下一次的mousemove事 件已经不再发给这个圆点对象了。
全栈程序员站长
2022/09/02
8510
Page.ClientScript.RegisterStartupScript() 方法「建议收藏」
Page.ClientScript.RegisterStartupScript() 方法 与Page.ClientScript.RegisterClientScriptBlock() 方法
全栈程序员站长
2022/09/09
2.2K0
JavaScript详细解析
我们之前的操作都是基于原生 JavaScript 的,比较繁琐。 JQuery 是一个前端框架技术,针对 JavaScript 进行了一系列的封装,使得操作变得非常简单! 期待吧……
全栈程序员站长
2022/09/09
1.5K0
javaWeb核心技术第五篇之jQuery
- 概述 - jQuery是一个优秀的javascript框架(js类库),兼容css3和各大浏览器,提供dom,events,animate,ajax等简易的操作。并且jQuery有非常丰富的插件,大多数功能都有相应的插件解决方案。jQuery的宗旨是write less, do more. (写的更少,做的更多) - jQuery入门 - jQuery和html整合 - 下载 - 下载地址:www.jquery.com - 使用script的src属性即可
海仔
2019/08/26
8.1K0
js中document.getElementById()用法「建议收藏」
dom标准里面的 获取当前文档中指定id的元素 if (document.getElementById(“regjm”).value != document.getElementById(“regjm1”).value ) { alert(“提示:请输入有效的认证码”); document.getElementById(“regjm1”).focus(); return false; } 例如: <script> function get() { if(document.getElementById(“Addr”).value==””) { alert(“null”); } else { alert(document.getElementById(“Addr”).value); } } </script> <head> <input type=”text” id=”Addr” value=””> <input type=”button” value=”click” οnclick=”get();”>
全栈程序员站长
2022/09/14
3.4K0
前端学习之路-CSS介绍,Html介绍,JavaScript介绍
学前端必备掌握CSS样式,css为层叠样式表,用来定义页面的显示效果,加强用户的体验乐趣,那么如何用css到html中呢?
达达前端
2019/07/03
1.9K0
前端学习之路-CSS介绍,Html介绍,JavaScript介绍
getElementById怎么调用
然后你就可以借这个方法来引用网页文件中各个标签的属性了,当然这个被你引用的标签必须具有ID属性;
全栈程序员站长
2022/09/14
1.3K0
相关推荐
事半功倍系列 javascript
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验