编程 Javascript

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

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JQuery1.4+ Ajax IE8 内存泄漏问题

Oct 15 Javascript

浅谈关于JavaScript的语言特性分析

Apr 11 Javascript

js创建对象的方式总结

Jan 10 Javascript

js实现在网页上简单显示时间的方法

Mar 02 Javascript

jQuery+ajax实现无刷新级联菜单示例

May 21 Javascript

javascript精确统计网站访问量实例代码

Dec 19 Javascript

jQuery获取table行数并输出单元格内容的实现方法

Jun 30 Javascript

prototype.js简单实现ajax功能示例

Oct 18 Javascript

Electron 如何调用本地模块的方法

Feb 01 Javascript

vue-cli 项目打包完成后运行文件路径报错问题

Jul 19 Javascript

layui 上传文件_批量导入数据UI的方法

Sep 23 Javascript

Vue实现简单的拖拽效果

Aug 25 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