JavaSrcipt报错时,说对象不支持此方法,XXX is not a function的情况

         在工作中,有时会用到JS写一些不用框架的js代码,用来控制客户端浏览器的一些动作。但是在这个过程中,常常会碰到一些很奇怪的问题。我最近就碰到过这方面的情况。

比如,当我在一个表单中,增加一个button,在该button中,定义一个函数,如:

            <input type="button" name="selectButton" onclick="ClearPacket()"  id="ClearPacket">.

         而在 <head></head>标签中定义如下函数:

        <script type="text/javascript">

              function ClearPacket(){

                    window.location.href="logInfo_clearPacket.action";

               }

         </script>

          此时,当点击上面的selectButton'时,根本没有响应,当继续跟踪调试时,会出现如下错误:对象不支持此方法,ClearPacket is not a function。

          这种情况很奇怪,明明我已经在上面定义了该button,也定义button对应的onclick方法,浏览器却说没有该方法。对与该问题,找了很久,

调试了很久,最终得到的结论如下: 因为我的input是在form表单中,如果此时input button按钮的js方法,本例中的onclick
="ClearPacket()"与 id="ClearPacket" 重复了,

此时会容易报出类似的错误。
除非id名与onClick
="ClearPacket()"在方法上不要重名,这可能是js解析器在解析时,首先解析的是id名造成的。此时,将所有的ClearPacket都当成了id了。 因此,最好的方法是,每个表单中,其id与方法名不要重复,这样的话,不会再出现类似的问题了。
高度决定视野,角度改变观念,尺度把握人生。
原文地址:https://www.cnblogs.com/liujian21st/p/2955252.html