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 相关文章推荐
JS等比例缩小图片尺寸的实例
Feb 27 Javascript
Jquery刷新页面背景图片随机变换的实现方法
Mar 15 Javascript
跟我学习javascript的隐式强制转换
Nov 16 Javascript
Bootstrap学习笔记之js组件(4)
Jun 12 Javascript
jQuery焦点图轮播效果实现方法
Dec 19 Javascript
Bootstrap框架安装使用详解
Jan 21 Javascript
详解使用angular的HttpClient搭配rxjs
Sep 01 Javascript
vue用addRoutes实现动态路由的示例
Sep 15 Javascript
vue的安装及element组件的安装方法
Mar 09 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
Apr 13 Javascript
JavaScript设计模式之观察者模式(发布订阅模式)原理与实现方法示例
Jul 27 Javascript
js自定义input文件上传样式
Oct 26 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
Codeigniter注册登录代码示例
2014/06/12 PHP
实用的PHP带公钥加密类分享(每次加密结果都不一样哦)
2014/08/20 PHP
Laravel中使用阿里云OSS Composer包分享
2015/02/10 PHP
PHP经典面试题集锦
2015/03/19 PHP
php ajax实现文件上传进度条
2016/03/29 PHP
PHP实现的折半查找算法示例
2017/12/19 PHP
掌握PHP垃圾回收机制详解
2019/03/13 PHP
jQuery的运行机制和设计理念分析
2011/04/05 Javascript
jQuery的选择器中的通配符使用介绍
2014/03/20 Javascript
基于jquery实现的仿优酷图片轮播特效代码
2016/01/13 Javascript
jQuery Ztree行政地区树状展示(点击加载)
2016/11/09 Javascript
详解AngularJS中$filter过滤器使用(自定义过滤器)
2017/02/04 Javascript
ionic3实战教程之随机布局瀑布流的实现方法
2017/12/28 Javascript
详解如何用webpack4从零开始构建react开发环境
2019/01/27 Javascript
echarts实现获取datazoom的起始值(包括x轴和y轴)
2020/07/20 Javascript
[00:44]2016完美“圣”典 风云人物:Mikasa宣传片
2016/12/07 DOTA
[51:00]Secret vs VGJ.S 2018国际邀请赛淘汰赛BO3 第一场 8.24
2018/08/25 DOTA
[05:08]DOTA2-DPC中国联赛3月6日Recap集锦
2021/03/11 DOTA
使用scrapy实现爬网站例子和实现网络爬虫(蜘蛛)的步骤
2014/01/23 Python
rabbitmq(中间消息代理)在python中的使用详解
2017/12/14 Python
python使用suds调用webservice接口的方法
2019/01/03 Python
基于python实现KNN分类算法
2020/04/23 Python
python接口自动化测试之接口数据依赖的实现方法
2019/04/26 Python
Python创建或生成列表的操作方法
2019/06/19 Python
python 使用装饰器并记录log的示例代码
2019/07/12 Python
Python 迭代,for...in遍历,迭代原理与应用示例
2019/10/12 Python
对Pytorch中Tensor的各种池化操作解析
2020/01/03 Python
tensorflow 实现自定义layer并添加到计算图中
2020/02/04 Python
Python如何通过百度翻译API实现翻译功能
2020/04/02 Python
MYPROTEIN澳大利亚官方网站:欧洲运动营养品牌
2019/06/26 全球购物
Eclipse面试题
2014/03/22 面试题
公司合作协议书范本
2014/04/18 职场文书
中班下学期个人工作总结
2015/02/12 职场文书
2016年艾滋病宣传活动总结
2016/04/01 职场文书
Python Socket编程详解
2021/04/25 Python
Python线程池与GIL全局锁实现抽奖小案例
2022/04/13 Python