- 外文名
- noclick
-
onclick与onClick
2014-04-24 14:56:16在JavaScript里为onclick,在html里为onClick 中间的才在JavaScript里为onclick,在html里为onClick
中间的c大小写不一样
因为这一点区别,费了我好大劲去找bug
这一知识点分享给大家
-
onclick事件
2017-02-27 15:20:04之前在浏览器上搜了一下onclick的ie兼容性,搜到一些ie不兼容onclick事件的文章,还错误认为onclick不兼容ie浏览器,今天改正这种看法:onclick事件的浏览器支持如下:也就是说ie浏览器支持onclick事件。 那么为什么...onclick事件
一.扫盲
- 之前在浏览器上搜了一下onclick的ie兼容性,搜到一些ie不兼容onclick事件的文章,还错误认为onclick不兼容ie浏览器,今天改正这种看法:onclick事件的浏览器支持如下:
- 也就是说ie浏览器支持onclick事件。
- 那么为什么还在网上搜到很多ie下onclick事件无效的帖子呢?这是因为,在ie浏览器下,当用到onclick事件时,在事件处理中可能用到了ie浏览器不兼容的属性,所以导致看起来像onclick没起作用。
二.详情
- onclick事件定义和用法:
onclick事件会在元素被点击时发生。
- 语法:
HTML中:
<element onclick=”SomeJavaScriptCode”>
JavaScript中:
object.onclick = function () { SomeJavaScriptCode };
- 应用实例1:
<button id="btn">点我弹出alert</button> <script> var myfun = function() { var b = document.getElementById("btn"); b.onclick = function () { alert("123"); } } myfun(); </script>
- 应用实例2:
<input id="ipt" onclick="f()" type="text"/> <script> var f= function() { alert("123"); } </script>
-
jq onclick
2018-11-30 13:33:02jQuery中,要使用attr()方法操作标签中的onclick属性必须使用jq库1.6或更新的库版本!针对标签属性的操作都是使用attr()方法来实现的 获取指定元素的属性值: $(选择器).attr(属性名) 如设置onclick属性: $("a")....jQuery中,要使用attr()方法操作标签中的onclick属性必须使用jq库1.6或更新的库版本!针对标签属性的操作都是使用attr()方法来实现的
获取指定元素的属性值: $(选择器).attr(属性名)
如设置onclick属性: $("a").attr("onclick","test();");
设置多个属性(题外话): $("a").attr({"href":"javacript:;","onclick":"receiveGift(this)"});
删除onclick属性: $("a").removeAttr("onclick");绑定执行一次的click事件: $("#exchange1").one("click",(function () { }))
解绑事件: $("#exchange1").unbind();<!DOCTYPE html> <html lang="en"> <head> <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <meta charset="UTF-8"> <title>Title</title> </head> <body> <p><a id="exchange1" href="javascript:;">点击调用exchange1方法</a><p> <p><h2><a id="top">这是标题,底部链接可以链接到这</a></h2> <p><a class="b" href="javascript:;" onclick="test();">点击后去掉该链接的onclick属性</a> <p><a class="c" href="javascript:;" onclick="javascript:test();" >点我onclick调用函数,只使用一次</a> <p><a class="d" href="javascript:;" >调用函数,只使用一次</a> <p><a href="javascript:test();" >点我href调用函数</a> <p><a title="编辑" href ="javascript:return false;" onclick="return false;">点击事件不可用</a> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <p><a href="#top">链接到标题</a> <script type="text/javascript"> $(function(){ //触发点击事件,相当于手动点击了超链接a //$(".b").click(); }); $("#exchange1").one("click",(function () { //只执行一次 alert("exchange1被调用了"); })) $(".d").one("click",function(){ console.log(222) }); function test(){ console.log(111) //a标签中去掉了href="#" 页面显示没有小鼠标 没有下划线 //href="#" 改成javascript:;(一般使用这个)/javascript:return false;可以不让页面跳到顶部,#默认链接到页首,有些浏览器会重新载入本页面。 //href="javascript:void();"其实这样写,在ie可能是有问题的,void()需要传入参数,一般为href="javascript:void(0); //$(".b").attr("onclick","test();");//添加onclick事件 //$(".b").removeAttr("onclick"); //不可点击: 移除onclick事件或者改变属性onclick="return false;" $(".b").attr("onclick","return false;");//一般使用这个,少用这个javascript:;return false; //通过一个伪链接来调用javascript方法,虽然点击该链接的时候不会跳转页面.但是滚动条会往上滚,解决的办法是返回一个false. //<a href="#" onclick="javascript:方法;return false;">提交</a> //改变多个属性$("#soft-list").find(".btns").addClass('disbtns').attr({"href":"javacript:;","onclick":"receiveGift(this)"}); //注意: 元素id和onclick函数名不能一致,否则就会导致onclick失效 } </script> </body> </html>
-
html页面调用js文件里的函数报错onclick is not defined处理方法
2016-11-11 18:12:41今天处理html标签里的onclick功能的时候总是报错:Uncaught ReferenceError: dosave is not defined(…) 找了半天都没发现错在哪,...input type="button" value="立即登录" onclick="dosave();"/> js: ...今天处理html标签里的onclick功能的时候总是报错:Uncaught ReferenceError: dosave is not defined(…)
找了半天都没发现错在哪,最后发现原来是我写法不对,正确写法如下:
html:
<input type="button" value="立即登录" onclick="dosave();"/>
js:
dosave = function (){ alert("成功啦!"); }
错误写法一般有以下两种,很致命:
function dosave(){ alert("会报错!!"); }
和
var dosave = function (){ alert("会报错!!"); }
为什么会这样,因为:
html页面调用js文件里的函数,写法必须为dosave = function (){}形式,其他方式写,html页面会搜索不到该函数。
------------------------------------------------------------------分割线----------------------------------------------------------------
上面是2016年11月11日的博客原文,三年来这个帖子争议非常大,帮助了很多朋友,也坑了很多朋友。在此感谢大家的回复,我把所有评论内容总结一下,希望能有帮助。
1.这个问题很奇特。很多同学平常使用var dosave = function(){}和function dosave(){}都没问题,但是突然一天出现用不了的情况了,我当时就是这样的情况;还有的同学在HBuidlder运行没问题,换eclipse就不起作用。
2.这三种定义函数的写法都是正确的,只不过作用域不同。
3.我们知道var dosave = function(){}和function dosave(){}是等价的,是最常用的定义函数方式,区别在于function dosave(){}可以进行声明提升,而var dosave = function(){}必须先定义才能使用。
4.dosave = function(){}的写法会把dosave函数作为全局作用域函数,相当于windows对象作为他的作用域,所以可以被调用到。
5.有同学给出了一种解决办法,不过我当时就没用$(functiong{ }),所以对我的情况不管用:
1)定义的方法 用funcation 方法名(){} ,这样写没有问题,不过js中千万别把方法写在$(functiong{ })中,这样相当于方法中方法,所以查找不到。
2)将方法放在 $().ready(function () {});之外后,就可以正常执行了。
6.当大家遇到莫名报错时这三种定义函数的写法都试试吧,说不定能帮助到大家,算是提供一种思路。
再次感谢大家的深入研究和回复,有问题希望大家多多回复,我会继续跟进这个问题,把更好的答案提供给大家。谢谢!
-
jquery动态清除onclick事件和添加onclick事件
2018-05-15 11:36:01jQuery中,针对标签属性的操作都是使用attr()方法来实现的,比如:$(“a”).attr(“onclick”)可获得a标签的onclick属性,对应的:删除onclick属性:$(“a”).removeAttr(“onclick”);设置onclick属性:$(“a”).... -
a href onclick用法
2012-11-02 17:37:04在a标签的href与onclick中使用javascript的区别 ⒈ 链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接); ⒉ 假设链接中同时存在 href 与 onclick,如果想让 href 属性下的... -
onclick 跳转
2015-07-15 15:38:16onclick="javascript:window.location.href='URL'" onclick="location='URL'" onclick="window.location.href='URL?id=11' -
关于html onclick 与js onclick 初学思考
2016-10-31 20:52:42相信大家都用过 html onclick 与js onclick 这两个事件函数。先来看一下两者的用法! html中的onclick的用法: 列子:Example html 中的onclick 是作为一个属性,后面写上js代码,若要写多条代码则可以用“”;“”... -
标签上直接添加onclick事件和jq绑定onclick事件有什么区别
2018-06-25 02:45:071. 标签上直接添加onclick事件: ``` <div class="btn watch-btn" onclick="handle()">查看TA的个人主页 ``` 2. jq绑定onclick事件 ``` 查看TA的个人主页 ``` ``` $(document).on('click', ... -
onclick方法无效
2018-12-26 14:47:03onclick方法无效 写程序的时候发现原来完好的代码突然不能用了,onclick方法不能正常执行, 并且提示Uncaught ReferenceError: XXX is not defined,代码如图所示: onclick=&quot;toModifyCourse(${... -
报错Uncaught ReferenceError: xxx is not defined at HTMLButtonElement.onclick
2018-04-09 15:20:51html标签里的onclick功能的时候总是报错:Uncaught ReferenceError: addrow is not defined at HTMLButtonElement.onclick 错误写法一般有以下两种:function dosave(){ alert("会报错!!"); } 和var dosave =... -
React自定义组件使用onClick传参注意:onClick只是一个名字而已!
2020-02-12 18:59:08核心: ...如果对React自定义组件写上onClick,也只是个单纯的名字而已,onClick的值作为props传到子组件. 例如: function Square(props) { return ( <button onClick={props.onClick} ... -
js禁用onclick事件
2020-10-28 19:43:59$(‘id’).attr(‘onclick’,’’); $(‘class’).attr(‘onclick’,’’); 例: $('.member-points-title-div').attr('onclick',''); $('#member-points-title-div').attr('onclick',''); -
onclick传参数
2019-02-28 20:18:09如何给th:onclick参数赋值1(如删除,修改都要id) th:onclick= "|javascript:edit('${noticemodel.mid}')|" 得到图片的写法 <div class="pic-warp cover-img" th:style="|... -
onclick事件的基本操作
2020-11-18 10:59:36p onclick="funp()" >点这里</p> js代码: function funp(){ console.log("点击了文字"); } 这样的,我们就会在点击文字时在控制台输出一句话。 完整样例代码: <!DOCTYPE html> <... -
onclick鼠标事件
2019-01-21 14:04:28什么是事件 JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。...(onclick)事件,需要浏览器做出处理,返回给用户一个结果。 主要事件表: onclick 鼠标点击事件 onmouseover 鼠标经过事件 o... -
onClick也可以写为onclick, 但最好不要这么搞
2016-03-01 23:48:58看代码: test 最然代码OK, 但这是很bad的风格, 还是用onClick吧。 至于onclick为什么可以, 是因为html是不区分大小写的, 要是在js中, 那注定是区分的。 -
querySelector无法绑定onclick
2020-05-13 16:56:04querySelector无法绑定onclick问题描述接下来我做了一些测试结论 问题描述 用querySelector()选择器获取一个Button并且为Button绑一个onclick事件,结果点击发现没有反应。 var btn = document.querySelector("#btn... -
hover onclick冲突
2018-01-22 13:53:28今天遇到一个问题:要求是一个div,hover是一种样式,onclick后是另一种样式,结果两者冲突,当点击后,还是hover的样式,只有离开div才是onclick,所以就用了!important。 后来自己又尝试了一个测试程序,发现... -
html onclick点击跳转
2019-06-27 16:01:45onclick="javascript:window.location.href='URL'" onclick="location='URL'" onclick="window.location.href='URL?id=11' -
Xpath 解析Onclick 谢谢
2017-07-02 01:59:17<a href="#" class="test" Onclick="Javascript:test()"> Xpath怎么获取 A标签里的 Onclick中 “ Javascript:test()”JS -
js onclick() 传递参数问题。onclick() 传递参数失败,jsp onclick() 失效!!!
2018-06-08 21:35:10平时一般不用onclick()事件,因为现在用原生js的比较少。但是如果是点击操作,并且要传递参数的时候,用onclick()事件,就会简单很多了。 但是这个看起来很简单的函数,今天在传递参数的时候出现了问题。下面我给... -
jquery 移除onclick事件
2020-06-05 18:37:48jquery中删除click事件...div id="test" onclick="setOnclick">onclick事件</div> <javascript> $("#test").removeAttr("onlick"); </javascript> 2、如当前click是由jquery事件绑定的事.. -
{ props.onClick() }与{ props.onClick } 的差异
2018-11-23 10:17:07props.onClick()} 直接修改为 onClick={props.onClick} , 注意不能写成 onClick={props.onClick()} 否则 props.onClick 方法会在 Square 组件渲染时被直接触发而不是等到 Board 组件渲染完成时通过点击触发... -
thymeleaf点击onclick事件
2018-12-17 17:29:55thymeleaf点击onclick事件 add是方法名,param是参数 th:onclick="'javascript:add('+${param}+')'" -
button标签的onclick事件
2018-08-23 14:49:561.普通的button标签定义onclick事件 (1):无参 <button onclick="mymethon()"></button> <script type="text/javascript"> function mymethon... -
layui button onclick失效
2019-11-20 13:04:04layui button onclick失效 <button type="button" class="layui-btn layui-btn-normal" onclick="test();">关闭</button> layui.use(['form'], function () { var form = layui.form ,... -
xxx is not defined at HTMLDivElement.onclick(onclick函数未定义)
2020-03-08 02:51:22解决方法: 检查 onclick 传参是否正确 检查script标签是不是多了module属性,如果是应该删除 type=“module”<script type="module"></script> -
C# .net onclick事件中变量的值在onclick执行结束后为啥清零了?
2017-07-04 08:20:40定义了一个int型全局变量page_num,在onclick中赋值,onclick事件执行完以后page_num竟然自动清零了,这是为啥?我需要保存每个onclick中赋给page_num的值,再给别的onclick事件调用。谢谢
-
JSP基于SpringMVC+Hibernate景点旅游网站设计.zip
-
易语言开发通达信DLL公式接口
-
web前端开发规范
-
蓝色教育资源信息网页模板
-
【数据分析-随到随学】数据分析建模和预测
-
绘客708S-P驱动.rar
-
三维地图GIS大数据可视化
-
html input只允许输入整数
-
ssm_超市订单管理系统.zip
-
three.js入门速成
-
OkHttp使用详解
-
「SequoiaDB巨杉数据库」count()概述1
-
【数据分析-随到随学】Mysql数据库
-
图像分割算法实战(深度学习).rar
-
阿里云云计算ACP考试必备教程
-
【数据分析-随到随学】Python数据获取
-
前端性能优化
-
2021-01-22
-
自定义数字键盘组件
-
【数据分析-随到随学】SPSS调查问卷统计分析