js函数名与form表单元素同名冲突的问题


Posted in Javascript onMarch 07, 2014

今天在导出Excel的时候用了Form 表单的input hidden 来区分导出和搜索。开始的时候js中的onClick事件的函数名 和 hidden 中的 id 命名一样。结果导致报错:调用函数的那一行对象不支持此属性。

找了很长时间都找不出原因,开始的时候一直以为是写错了某个字母,才发现js函数根本没有执行。后来没有办法直接调用了别的函数,发现就有用了,认为是函数名的原因,改了函数名才有用了。然后再将input中的id改成很函数名一样,又出现报错了。在没有下例验证之前,还一直以为是ThinkPHP模板解析的bug。因为有了如下示例,所以证实是js中的函数名不可以和元素中的id相同。

如下例:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>ceshi</title>
<script>
function a()
{
 document.getElementById('a').value="test";
 alert(document.getElementById('a').value);
 return false;
}
</script>
</head>
<body>
<form>
<input type="hidden" id="a" name="a" value="" />
<input type="button" value="excel" onClick="javascript:a();"/>
</form>
</body>
</html>

网页错误详细信息

用户代理: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; CIBA; .NET CLR 2.0.50727)
时间戳: Thu, 27 Jan 2011 13:30:09 UTC

消息: 对象不支持此属性或方法
行: 17
字符: 1
代码: 0
URI: file:///C:/Documents%20and%20Settings/Administrator/桌面/test.html

Javascript 相关文章推荐
setInterval 和 setTimeout会产生内存溢出
Feb 15 Javascript
阻止子元素继承父元素事件具体思路及实现
May 02 Javascript
简单常用的幻灯片播放实现代码
Sep 25 Javascript
jquery next nextAll nextUntil siblings的区别介绍
Oct 05 Javascript
浅谈window对象的scrollBy()方法
Jul 15 Javascript
Angular.js中$apply()和$digest()的深入理解
Oct 13 Javascript
详解js界面跳转与值传递
Nov 22 Javascript
jQuery的extend方法【三种】
Dec 14 Javascript
基于js中document.cookie全面解析
Sep 14 Javascript
Vue如何实现响应式系统
Jul 11 Javascript
JQuery样式操作、click事件以及索引值-选项卡应用示例
May 14 jQuery
JavaScript本地储存:localStorage、sessionStorage、cookie的使用
Oct 13 Javascript
javascript(js)的小数点乘法除法问题详解
Mar 07 #Javascript
jquery中常用的函数和属性详细解析
Mar 07 #Javascript
jquery 操作两个select实现值之间的互相传递
Mar 07 #Javascript
JS判断文本框内容改变事件的简单实例
Mar 07 #Javascript
使用js判断TextBox控件值改变然后出发事件
Mar 07 #Javascript
jquery1.10给新增元素绑定事件的方法
Mar 06 #Javascript
jquery单行文字向上滚动效果示例
Mar 06 #Javascript
You might like
有关phpmailer的详细介绍及使用方法
2013/01/28 PHP
destoon数据库表说明汇总
2014/07/15 PHP
PHP中的switch语句的用法实例详解
2015/10/21 PHP
thinkphp微信开发(消息加密解密)
2015/12/02 PHP
Yii2基于Ajax自动获取表单数据的方法
2016/08/10 PHP
yii2 url重写并隐藏index.php方法
2018/12/10 PHP
Notify - 基于jquery的消息通知插件
2011/10/18 Javascript
connect中间件session、cookie的使用方法分享
2014/06/17 Javascript
Jquery结合HTML5实现文件上传
2015/06/25 Javascript
使用Chart.js图表库制作漂亮的响应式表单
2015/10/28 Javascript
浅谈JavaScript 中有关时间对象的方法
2016/08/15 Javascript
canvas实现手机端用来上传用户头像的代码
2016/10/20 Javascript
原生js实现弹出层效果
2017/01/20 Javascript
JS验证字符串功能
2017/02/22 Javascript
JavaScript实现自动跳转文本功能
2017/05/25 Javascript
react-native中ListView组件点击跳转的方法示例
2017/09/30 Javascript
webpack4简单入门实例
2018/09/06 Javascript
Js通过AES加密后PHP用Openssl解密的方法
2019/07/12 Javascript
js getBoundingClientRect使用方法详解
2019/07/17 Javascript
vue接通后端api以及部署到服务器操作
2020/08/13 Javascript
Vue按时间段查询数据组件使用详解
2020/08/21 Javascript
[03:37]2016完美“圣”典 风云人物:Mikasa专访
2016/12/07 DOTA
使用Python构建Hopfield网络的教程
2015/04/14 Python
Python 函数返回值的示例代码
2019/03/11 Python
python项目对接钉钉SDK的实现
2019/07/15 Python
numpy数组做图片拼接的实现(concatenate、vstack、hstack)
2019/11/08 Python
tensorflow之变量初始化(tf.Variable)使用详解
2020/02/06 Python
html5绘制时钟动画
2014/12/15 HTML / CSS
C语言中break与continue的区别
2012/07/12 面试题
仓库管理制度
2014/01/21 职场文书
十周年庆典策划方案
2014/06/03 职场文书
合唱兴趣小组活动总结
2014/07/10 职场文书
小学假期安全广播稿
2014/09/28 职场文书
安全先进个人材料
2014/12/29 职场文书
党风廉洁教育心得体会
2016/01/20 职场文书
Go 语言下基于Redis分布式锁的实现方式
2021/06/28 Golang