admin管理员组文章数量:1558103
Firefox火狐浏览器js点击事件不执行,chrome/IE浏览器js点击事件正常执行;
- 问题现象
- 查找问题原因
- 网上查找资料 寻求答案
- 寻求公司“大佬” 解决有点像 兼容性的问题
- 官方对disable的解释:
- 出问题的代码
- 正确的代码结构
- 总结
问题现象
Firefox火狐浏览器js点击事件不执行,chrome/IE浏览器js点击事件正常执行;
查找问题原因
由于在firfox中点击事件都不执行,在浏览器中尝试 手动修改id名称;并执行js绑定事件
$("#test123").unbind().bind("click",function(){ console.log("123123");});
执行完上述js之后点击相应的绑定元素并不执行打印 “123123”内容;
网上查找资料 寻求答案
- 搜索关键词**“火狐浏览器点击事件不执行”**
- 结果中大多是说火狐绑定js事件原理和chrome一样 ;
- 火狐选择器不一样建议换成id选择器;
- 其他一些错误,例如js代码逻辑写错了;
这些都不是原因
寻求公司“大佬” 解决有点像 兼容性的问题
还是老话说的好,姜还是老的辣
大佬来就说了一句,你这个input 上面有个disable 属性;这个东西好像有点变态,官方文档的解释是会禁用元素,和点击事件。
官方对disable的解释:
disabled 属性是一个布尔属性。
disabled 属性规定应该禁用的 元素。
被禁用的 input 元素是无法使用和无法点击的。
disabled 属性进行设置,使用户在满足某些条件时(比如选中复选框,等等)才能使用 元素。然后,可使用 JavaScript 来删除 disabled 值,使该 元素变为可用的状态。
提示:表单中被禁用的 元素不会被提交。
注意:disabled 属性不适用于 。PS:期间找过前端人员协助查找问题,但是前端给出的意见是某些央视上面的兼容性问题。最后还是根据“大佬”的话。无意之间将 disable 属性去掉了,点击事件在火狐中就生效了。
出问题的代码
html 结构:
<input type="button" id="xxx" disable="disable"/>
js 代码
$("#ID“).unbind().bind("click",function(){
点击事件代码逻辑;
});
正确的代码结构
html 结构: 将input设置为只读属性,而不采用disable属性来做一个不允许输入的效果
<input type="button" id="xxx" readonly="readonly" />
js 代码
$("#ID“).unbind().bind("click",function(){
点击事件代码逻辑;
});
总结
- 本功能就是在input 标签的基础上做一个假的输入框的效果,不能让用户输入内容。所以用了一个disable属性将input的禁用达到不能输入的效果。
- 经此发现对于html 标签基础属性的理解还是存在比较浅显的理解,并没有真正理解其含义。
- 活到老学到老,才是程序员的生存之道啊。
亲爱的朋友,如果文章对你有用。记得点赞哦!!!
版权声明:本文标题:Firefox火狐浏览器js点击事件不执行,chromeIE浏览器js点击事件正常执行; 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:https://m.elefans.com/xitong/1727373079a1111398.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论