TypeError: prc.cng()在火狐中不是函数，未捕获TypeError:对象#<HTMLInputElement>在Chrome中没有方法'cng‘
我正在写一个小型库，在我工作的项目中内部使用，我是一个业余的Javascript开发人员，所以请注意我的错误。
我已经写了一个小的html文件以及下面的javascript，
<html>
<head>
<script>
var prc = {
cng : function(evt){
console.log(evt);
}
}
</script>
</head>
<body>
<input type='text' id='prc' onkeydown="prc.cng(window.event)"/>
<body>
</html>我试着在Firefox和Chrome中执行，而不是在IE中。
当我在火狐中尝试时，它给出了这个错误"TypeError: prc.cng is not a function"，而当我在chrome中尝试时，它给出了"Uncaught TypeError: Object #<HTMLInputElement> has no method 'cng'"。
我试着在StackOverflow中搜索这个，但他们面临的问题与我面临的问题非常不同。几乎大多数面临的问题都与jQuery有关，在这里请注意，我没有使用任何类型的库，也没有使用普通的旧Javascript编写。
如果能帮助我加深对这个问题的理解，我将不胜感激。
回答 2
Stack Overflow用户
发布于 2013-05-16 16:20:52
如果一个元素的id与现有的JS变量相同，那么就会破坏变量的内容，并将其替换为对该元素的引用。
快速的解决方案是更改变量名或元素id。
一个更健壮的解决方案是将所有数据保持在尽可能窄的范围内。如果你不迫切需要它是全局的，那么就不要把它设置成全局的，这样它就不会被脚本之外的代码覆盖。
由于使用固有的事件属性，您只能引用<script>元素中的变量(如果它们是全局的)，所以现在也是停止使用它们并转向更新的东西的好时机。
// Self-executing anonymous function expression used to limit scope
(function () {
// Locally scoped prc that won't clash with the element
var prc = {
cng : function(evt){
console.log(evt);
}
}
// Event handler binding
document.getElementById('prc').addEventListener('keydown', function (evt) {
prc.cng(evt)
});
}());请注意，此脚本在load或domReady之前不会延迟执行，因此请将它放在输入之后，这样当尝试查找事件处理程序时，输入就会存在。
Stack Overflow用户
发布于 2013-05-16 16:22:22
我已经找到了我自己问题的答案，感谢@Barmar，他帮助我理解了这个问题。
当我像这样定义html中的任何元素时
<input type='text' id='test' onkeydown='test.fn()'/>这意味着一个对象是由浏览器为同一对象创建的。因此，如果我编写的javascript与id冲突，那么在页面中的任何地方都无法访问它。
<script>
var test = {
fn : function(){
console.log('test');
}
}
</script>所以理想情况下，要么重命名id，要么重命名对象。
https://stackoverflow.com/questions/16581252
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号