JS封装问题(prototype)

执行顺序有问题,你调用gI.init()时
<input   type= "text "   id= "inp1 "/> <br/> 
<input   type= "text "   id= "inp2 "/> 
还没有生成
<!DOCTYPE   html   PUBLIC   "-//W3C//DTD   XHTML   1.0   Transitional//EN "   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 
<html   xmlns= "http://www.w3.org/1999/xhtml "> <head> 
<meta   http-equiv= "Content-Type "   content= "text/html;   charset=gb2312 "   /> 
<title> prototype </title> 
<script   type= "text/javascript "> 
function   getInput(name,objID1,objID2){ 
      this.name=name; 
      this.obj1=objID1; 
      this.obj2=objID2; 
} 
getInput.prototype.init=function(){ 
      document.getElementById(this.obj2).onkeyup=this.prn;//该条出错,说为空或不是对象,想知道如何能把input对象以参数形式传入并定义事件等 
} 
getInput.prototype.prn=function(){ 
      alert(document.getElementById(this.obj1).value+ "& "+document.getElementById(this.obj2).value); 
} </script> 
</head> <body> 
<input   type= "text "   id= "inp1 "/> <br/> 
<input   type= "text "   id= "inp2 "/>
<script>
var   gI=new   getInput( 'gI ', 'inp1 ', 'inp2 '); 
gI.init(); 
</script> 
</body> 
</html> 

解决方案 »

  1.   

    getInput.prototype.prn=function(){   
                alert(document.getElementById(this.obj1).value+   "&   "+document.getElementById(this.obj2).value);   
    }  而且你的这个函数执行时,此时的this对象指向的是<input type="text" id="inp2"/> ,
    而非gI对象了this是谁执行这个函数就指向谁
      

  2.   

    楼上说的有理,但是
    getInput.prototype.prn=function(){   
                alert(document.getElementById(this.obj1).value+   "&   "+document.getElementById(this.obj2).value);   //说缺少对象
    }   
      

  3.   


    <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title> prototype </title> 
    <script type="text/javascript"> 
    function getInput(name,objID1,objID2){ 
      this.name=name; 
      this.obj1=objID1; 
      this.obj2=objID2; 
    } 
    getInput.prototype.init = function(){
      document.getElementById(this.obj2).onkeyup = (function () {
    var wc = this;
    return function (event) {
       wc.prn(event);//该条出错,说为空或不是对象,想知道如何能把input对象以参数形式传入并定义事件等 
    }
    }).call(this);
    } 
    getInput.prototype.prn = function(){ 
    alert(document.getElementById(this.obj1).value+"&"+document.getElementById(this.obj2).value);
    } window.onload = function () {
    var gI = new getInput('gI','inp1','inp2'); 
    gI.init();
    }
    </script>
    </head><body>
    <input type="text" id="inp1"/><br/> 
    <input type="text" id="inp2"/> 
    </body> </html>
      

  4.   

    建立个闭包就可以了this和apply,call的介绍可以参考这两篇文章http://blog.csdn.net/muxrwc/archive/2007/11/09/1876342.aspxhttp://blog.csdn.net/muxrwc/archive/2007/10/31/1859284.aspx
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title> prototype </title></head><body>
    <input type="text" id="inp1"/> <br/>
    <input type="text" id="inp2"/>
    </body></html>
    <script type="text/javascript">
    function getInput(name,objID1,objID2){
      this.name=name;
      this.obj1=objID1;
      this.obj2=objID2;
    }
    getInput.prototype.init=function(){
    var This = this;
    this.prn=function(){
    alert(document.getElementById(This.obj1).value+"&"+document.getElementById(This.obj2).value);
    }
    document.getElementById(this.obj2).onkeyup=this.prn;//该条出错,说为空或不是对象,想知道如何能把input对象以参数形式传入并定义事件等
    }
    var gI=new getInput('gI','inp1','inp2');
    gI.init();
    </script>
      

  6.   

    小弟是个小菜,muxrwc 兄能解释一下下面的代码吗?
    getInput.prototype.init = function(){
      document.getElementById(this.obj2).onkeyup = (function () {
            var wc = this;
            return function (event) {
                  wc.prn(event);
            }
        }).call(this);
    } 
      

  7.   

    就是执行function   ()  { var wc = this; ....}这个函数，建立个闭包因为直接(function () {})()
    这样执行函数的话
    this是指向window的。所以需要用call改变下this的指向
    这样执行的这个函数里，this就是gI了
    然后创建一个局部变量wc 值是对gi的引用
    然后返回一个函数。。
    函数里调用到了那个变量wc所以产生闭包
    getInput.prototype.init   =   function(){ 
    var wc = this;
        document.getElementById(this.obj2).onkeyup   =   function   ()   { 
               wc.prn(event); 
        };
    };这样写也可以的:D