<html>
<head>
<title></title>
<script type="text/javascript" >
function selectAll(){
alert("11111111");
}
</script>
</head>
<body>
<input type="checkbox" name="selectAll" id="selectAll" οnclick="selectAll(this)"/>
</body>
</html>
上面代码出错,报“对象不支持此方法(selectAll)或属性”,个人分析是因为checkbox也是个html dom对象,这样的话,会先找到这个对象,而checkbox本身是没有selectAll方法的,所以出错了。所以要把方法名或者该对象的name和id改成别的名字,不要同名就可以正确运行了。
另外在网上也找到相关类似的说法:
转自:http://xingda1989.iteye.com/blog/1147745
今天突然碰到form表单的名字与js方法的名字相同导致找不到js方法的问题,根据网上的一些资料和自己的理解,总结出一定原因,个人理解有错误请指正~~~
代码:
这样就提示找不到test方法。
这个form是一个HTML DOM对象有莫大的关系,根据事件的触发对象的作用域链往上找名为test的对象,因为javascript中方法其实也为对象,在沿着对象的作用域链往上找时,他首先回找到名字为test的HTML DOM对象form,而不会找到window.test这个对象,而找到的这个test不是一个方法,所以会提示找不到方法。这跟以下代码情况是一样的
因为button也是一个HTML DOM对象,所以首先找到的是button这个对象,所以也提示找不到方法。
改成外部绑定事件就不会出现这种情况,因为这时这时aa的环境就在window对象中,回直接找到test方法,看代码:
总结:
用元素的onclick事件时,文档中不能出现与方法名一样的HTML DOM对象,因为根据作用域链他最后才会找到window对象的方法,所以都会显示找不到方法。
代码:
- <form name="test" id="test" >
- <a href="#" onclick="test()" name="test">aa</a>
- </form>
- <script type="text/javascript">
- function test(){
- alert("ssss");
- }
- </script>
<form name="test" id="test" > <a href="#" οnclick="test()" name="test">aa</a> </form> <script type="text/javascript"> function test(){ alert("ssss"); } </script>
这样就提示找不到test方法。
这个form是一个HTML DOM对象有莫大的关系,根据事件的触发对象的作用域链往上找名为test的对象,因为javascript中方法其实也为对象,在沿着对象的作用域链往上找时,他首先回找到名字为test的HTML DOM对象form,而不会找到window.test这个对象,而找到的这个test不是一个方法,所以会提示找不到方法。这跟以下代码情况是一样的
- <form name="aaa" id="test" >
- <input type="button" onclick="test()" name="test">aa</a>
- </form>
- <script type="text/javascript">
- function test(){
- alert("ssss");
- }
- </script>
<form name="aaa" id="test" > <input type="button" οnclick="test()" name="test">aa</a> </form> <script type="text/javascript"> function test(){ alert("ssss"); } </script>
因为button也是一个HTML DOM对象,所以首先找到的是button这个对象,所以也提示找不到方法。
改成外部绑定事件就不会出现这种情况,因为这时这时aa的环境就在window对象中,回直接找到test方法,看代码:
- <form name="aaa" id="test" >
- <input type="button" onclick="test()" name="test">click me</a>
- </form>
- <script type="text/javascript">
- var aa = document.getElementById("sss");
- aa.onclick = test;
- function test(){
- alert("ssss");
- }
- </script>
<form name="aaa" id="test" > <input type="button" οnclick="test()" name="test">click me</a> </form> <script type="text/javascript"> var aa = document.getElementById("sss"); aa.onclick = test; function test(){ alert("ssss"); } </script>
总结:
用元素的onclick事件时,文档中不能出现与方法名一样的HTML DOM对象,因为根据作用域链他最后才会找到window对象的方法,所以都会显示找不到方法。