zoukankan      html  css  js  c++  java
  • 遇到的一个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。以前略有耳闻,后来好久没写忘了...

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

    //-------------------------------------------------------------------------------------------------------------------------------------------

    //2014.10.30

    其实很简单,事件绑定了多次而已...

  • 相关阅读:
    xna 添加一个精灵1
    【leetcode】705. 设计哈希集合
    【leetcode】1603. 设计停车系统
    【leetcode】设计有序流
    【leetcode】旅行终点站
    【leetcode】检测大写字母
    【leetcode】重复至少 K 次且长度为 M 的模式
    【leetcode】二叉树的直径
    【leetcode】公交站间的距离
    【leetcode】分糖果
  • 原文地址:https://www.cnblogs.com/GaiDynasty/p/3766801.html
Copyright © 2011-2022 走看看