遇到的一个JS原型的问题,还没得到解决

今天写代码的时候出现了一些问题。首先我的html文件是这样的

<div id = "tag_add" onclick="addUser()"></div>

恩恩,很清楚,调用了addUser()方法


var addUser = function () {
var i=0;
document.onkeydown = function(e){
var ev = document.all ? window.event : e;
if(ev.keyCode==13) {
submit_dialog();
}
if(ev.keyCode==27) {
quit_dialog();
}

}
function quit_dialog (){
/*隐藏了dialog的div*/
}
$("#head_close,#bottom_canser").click(function() {
quit_dialog();
});
function submit_dialog(){
alert(name+phone+plantNO);
}
$("#bottom_submit").click(function() {
submit_dialog();
});
}

第一次调用,用鼠标点了submit,没有问题;第二次调用,恩?怎么alert弹出了两次??妈蛋的!第三次调用,好吧,alert弹出了三次了!

我立马想到了onclick调用函数是不是每次都要新建一个函数实例呢?javaEE有单例原型的概念,放到这种情况,应该就是js解释器每次都是新建了一个函数对象的单例了吧?前一个单例没有结束而后一个单例又被调用了才会出现这种问题??(这里求解啊!!)

于是我加了一段代码求证


var addUser = function () {
var i=0;
document.onkeydown = function(e){
var ev = document.all ? window.event : e;
if(ev.keyCode==13) {
submit_dialog();
}
if(ev.keyCode==27) {
quit_dialog();
}

}
function quit_dialog (){
/*隐藏了dialog的div*/
}
$("#head_close,#bottom_canser").click(function() {
quit_dialog();
});
function submit_dialog(){
alert(name+phone+plantNO);
}
$("#bottom_submit").click(function() {
submit_dialog();
i++;
console.log(i);
});
}

然后查看了一下我的控制面板

恩,跟我想的一样!的确是新建了新的实例。正当我确认是这样的以后,却发现,用按键触发不会发生这些问题!是因为 var addUser =
function () {} 这个每次访问的都是原型么?不懂求解啊!

很容易的想到了搜索js的原型怎么使用,prototype。以前略有耳闻,后来好久没写忘了...

问题还没解决,如果有高手解答不胜感激啊!

时间: 2024-08-06 16:37:23

遇到的一个JS原型的问题,还没得到解决的相关文章

分享一个js原型继承的方法

function Person(){ this.color = [23,2,3,32] } undefined var p = Object.create(new Person()) undefined p.color.push(1)

简单粗暴地理解js原型链--js面向对象编程

简单粗暴地理解js原型链--js面向对象编程 原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧,想点与代码无关的事,比如人.妖以及人妖. 1)人是人他妈生的,妖是妖他妈生的.人和妖都是对象实例,而人他妈和妖他妈就是原型.原型也是对象,叫原型对象. 2)人他妈和人他爸啪啪啪能生出一堆人宝宝.妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗

js原型 作用域

了解JavaScript原型链之前首先肯定要知道什么是原型. JavaScript中,原型是一个对象,通过原型可以实现属性的继承.既然原型是一个对象,那么任何一个对象都可以称为原型吗?是,记住它.什么对象有原型?任何对象(undefined,null,boolean,number,string是主类型,不是对象)默认情况下都有一个原型,但是原型也是一个对象,所以对象的原型也有原型,记住,下面有用. js中的对象中都包含一个指向原型对象的指针,但是是不能被直接访问的,为了方便的看到原型,chrom

深入理解JS原型链与继承

我 觉得阅读精彩的文章是提升自己最快的方法,而且我发现人在不同阶段看待同样的东西都会有不同的收获,有一天你看到一本好书或者好的文章,请记得收藏起来, 隔断时间再去看看,我想应该会有很大的收获.其实今天要讨论的主题,有许多人写过许多精彩的文章,但是今天我还是想把自己的理解的知识记录下来.我在学习 掌握JS原型链和继承的时候,就是看得@阮一峰老师的写的文章,觉得他写的技术类的文章都容易让理解,简明概要,又好理解.他是我学习JS路程里面一个比较佩服的导师,昨天重新看了他写的<Javascript 面向

JS 原型链学习总结

废话篇: 在js的学习过程中有一大难点就是原型链.学习的时候一直对这一内容不是十分的明白.纠结的我简直难受.,型号总算给他弄通了,哇咔咔,总算可以不用在睡梦中还想着他了. 正文篇: 要了解原型链我们首先要记住的一点是JS中所有的东西都可以用对象来理解.函数在JS中实际上也是一个对象.然后再去看原型链的东西. 上图是首要的: 实际上我们可以吧JS中的对象看成两种,一种是我们所熟知的一般的对象,还有一种就是JS中所有的方法对象. 一般对象: 对于一般的对象而言,其实际上就是一个方法与属性的集合,而在

js原型(prototype)和面对对象

•在JS中,每当定义一个函数时候,函数中都会包含一些预定义的属性.其中的一个属性就是原型对象 prototype,原型的作用就是给这个类的每一个对象都添加一个统一的方法,在原型中定义的方法和属性都是被所以实例对象所共享. •__proto__是一个对象拥有的内置属性,是JS内部使用寻找原型链的属性.当实例化一个对象时候,内部会新建一个__proto__属性并把prototype赋值给它. prototype对象就是让你有能力向对象添加属性和方法.__proto__相当于继承了prototype.

改造一个JS插件的过程记录

最近做一个合作项目,对方要求我们做一个web应用程序,然后嵌入到他们的总的wen应用中,风格要求保持一致,于是乎就发了一个html文件过来,大概列举了一下各种控件,对话框的效果. 好了,重点说其中的一个弹出插件,其源码为: (function($) { $('a[data-reveal-id]').live('click', function(e) { e.preventDefault(); var modalLocation = $(this).attr('data-reveal-id');

37.浅谈js原型的理解

浅谈Js原型的理解 一.js中的原型毫无疑问一个难点,学习如果不深入很容易就晕了!    在参考了多方面的资料后,发现解释都太过专业,对于很多还没有接触过面向对象    语言的小白来说,有理解不了里面的专有名词!如果你没学过c++或者Java之类的更接触底层的语言,那就不要太深究,理解会用自然可以了,当接触到更多语言时慢慢的会理解越来越深刻! 下面我就举例分享一下prototype的概念!知道对于初学者知道这些就足够了! 分析一下,上面这个例子!我们可以知道 People的类型是一个对象!按照j

js原型及原型链

js对象与其它面向对象编程语言的差异 --  JAVA与C++等语言中的对象,是先构造一个类抽象事物,再通过类实例化一个个对象.但javascript中,中不区分类和实例的概念,而是通过原型(prototype)来实现面向对象的封装,继承和多态,从而实现面向对象编程. 什么是面向对象编程? 将现实世界中各种复杂的关系,抽象为一个个对象,由对象的之间的分工和合作,完成对真实世界的模拟 具有灵活性,代码可重用性,模块性等特点,容易维护和开发,适合多人合作的大型软件项目 什么是js原型? 在JavaS