Javascript onclick事件调用对象

可能重复：

我正在做一个与Javascript相关的作业，需要制作一个与特定输入相关的日历

日历会持续显示，不会隐藏，等等

可以有多个日历指向不同的文本字段

现在，每个日历都由一个Javascript对象创建，即

var cal1=new Calendar("inputfield_id");

现在，calendar对象有一些我希望在单击日历时访问的变量

所以基本上，我的问题是，有没有一种方法可以为onclick事件获取一个特定的对象，也就是说，当你在一个对象中时，以某种方式获取“this”变量

---

下面是代码的一小部分来解释我正在尝试做什么：

function calendar(id){
   this.date=new Date();
   this.id=id;
   this.next_year=function(){
        this.date.setFullYear(this.date.getFullYear()+1);
        alert(this.date); // basically I want to get object context here to change date
   }

   var temp_but=document.createElement("button").onclick=this.next_year;
   document.getElementById(id+"_div").appendChild(temp_but);
   document.getElementById(id+"_div").lastChild.onclick=this.next_year;

}

---

基本上，在

this.nextyear

函数中，我想获取对象上下文以获取日期并相应地更改日历。

我想这就是您想要做的

function calendar(id){
   this.date=new Date();
   this.id=id;
   var context = this;
   this.next_year=function(){
        context.date.setFullYear(context.date.getFullYear()+1);
        alert(context.date);//basically i want to get object context here to change date
   }

   var temp_but=document.createElement("button").onclick=this.next_year;
   document.getElementById(id+"_div").appendChild(temp_but);
   document.getElementById(id+"_div").lastChild.onclick=this.next_year;

}

本质上，我们使用闭包来保存对

这个
的引用，称为
上下文
<代码>此。下一年
现在通过
上下文
引用日历对象


编辑：一个小小的JS课程来回应发表的评论


当您将函数作为构造函数调用时（即，
new
calendar（“示例”）
），将创建一个新的空对象，并在该新空对象的上下文中执行该函数

注意：它实际上不仅仅是一个空对象。它是一个空对象，在幕后有一些内部指针，用于原型继承之类的事情

不管是谁！在整个函数中，对它的任何引用都是指当前上下文。而且，因为当您将函数用作构造函数时，它会在新创建对象的上下文中调用该函数，所以您可以使用
this.someProperty
设置对象的属性

执行语句
var cal1=new calendar（“inputfield_id”），创建一个新对象，并在所述对象的上下文中执行您的函数
calendar
。所以，
this.date=newdate（）
和
this.id=id
正在设置新日历对象的
date
和
id
属性

我假设您在理解这里发生的事情时没有遇到困难：
this.id=idthis
关键字在
this中不起作用。明年

让我们从一个场景开始，在这个场景中它会起作用。如果你要调用
cal1.next_year（）
，您将在
cal1
的上下文中调用
next_year（）
，因此
this.date.setFullYear（this.date.getFullYear（）+1）
将按预期将
cal1
的日期属性增加1年

它在click事件处理程序中不起作用，因为当您设置事件处理程序时，您会说“当触发'click'事件时，执行此函数”，而不是“当触发'click'事件时，执行此语句””

实际执行的函数是：

   function(){
        this.date.setFullYear(this.date.getFullYear()+1);
        alert(this.date);
   }

您希望执行的语句是：

   this.next_year(); //where this refers to the calendar object.


当代码执行时

elem.onclick = this.next_year;

就是说,

elem.onclick = function(){
    this.date.setFullYear(this.date.getFullYear()+1);
    alert(this.date);
}

因此，如果这个问题还不够清楚，让我进一步解释一下，在使用
elem.onclick=this.next\u year设置单击处理程序后，单击元素
elem
，实际会发生什么情况。我喜欢将其视为浏览器正在调用
elem.onclick（[Event]）。本质上，使用
elem.onclick=
设置的函数是在
elem
的上下文中执行的，并且
事件
对象作为第一个也是唯一的参数传入

为了清楚地说明问题并将该点带回家，函数中的
this
关键字指向浏览器作为事件处理程序调用时单击的元素

   function(){
        this.date.setFullYear(this.date.getFullYear()+1);
        alert(this.date);
   }


我为过度解释和重复/多余而道歉。我尽量保持简短的回答，因为我通常不善于解释事情：P

PS-别忘了接受
 我想这就是你想要做的

function calendar(id){
   this.date=new Date();
   this.id=id;
   var context = this;
   this.next_year=function(){
        context.date.setFullYear(context.date.getFullYear()+1);
        alert(context.date);//basically i want to get object context here to change date
   }

   var temp_but=document.createElement("button").onclick=this.next_year;
   document.getElementById(id+"_div").appendChild(temp_but);
   document.getElementById(id+"_div").lastChild.onclick=this.next_year;

}

本质上，我们使用闭包来保存对
这个
的引用，称为
上下文
<代码>此。下一年
现在通过
上下文
引用日历对象


编辑：一个小小的JS课程来回应发表的评论


当您将函数作为构造函数调用时（即，
new
calendar（“示例”）
），将创建一个新的空对象，并在该新空对象的上下文中执行该函数

注意：它实际上不仅仅是一个空对象。它是一个空对象，在幕后有一些内部指针，用于原型继承之类的事情

不管是谁！在整个函数中，对它的任何引用都是指当前上下文。而且，因为当您将函数用作构造函数时，它会在新创建对象的上下文中调用该函数，所以您可以使用
this.someProperty
设置对象的属性

执行语句
var cal1=new calendar（“inputfield_id”），创建一个新对象，并在所述对象的上下文中执行您的函数
calendar
。所以，
this.date=newdate（）
和
this.id=id
正在设置新日历对象的
date
和
id
属性

我假设您在理解这里发生的事情时没有遇到困难：
this.id=idthis
关键字在
this中不起作用。明年

让我们从一个场景开始，在这个场景中它会起作用。如果你要调用
cal1.next_year（）
，您将在
cal1