Question

所以我试图修改游戏KuKu Kube的纯HTML / CSS版本，添加一个计时器，更多级别和标准化的一面，但我可能能够解决这些问题。

所以，我有这段代码：

_Application olApp = new Microsoft.Office.Interop.Outlook.Application();
_AppointmentItem apt = (_AppointmentItem) olApp.CreateItem(OlItemType.olAppointmentItem);
// set some properties
apt.Subject = item.Subject;
apt.Body = item.Body;
apt.Location = item.Location;                     //Set the location
apt.Start = item.Start;                           //Set the start date 
apt.End = item.End;                               //End date 
apt.ReminderSet = true;                           //Set the reminder
apt.ReminderMinutesBeforeStart = 15;              //Reminder time
apt.Importance = OlImportance.olImportanceNormal; //Appointment importance
apt.BusyStatus = OlBusyStatus.olFree;             //Busy status
apt.Close(OlInspectorClose.olSave);

我已经花了至少一个小时倾注之前的代码，并且作为一个新手，我的分析是多维数据集是复选框，并且它们会转换。

顺便说一下，JSFiddle在这里，但我觉得它不起作用的原因在于这5行。

那么，为什么transitionend不会触发showMessage（）？

提前致谢。

Answer 1

因为您立即呼叫showMessage，而不是将其设置为事件监听器。

例如，如果您这样做：

var value = showMessage();
console.log(value);

您可能会在控制台中看到undefined。相反，您希望将函数本身作为参数传递，而不是它的返回值。

element.addEventListener('transitionend', showMessage, false);
//                           Notice the lack of () --^

另外，如果你打开你的控制台，你会发现你正在获得

未捕获的TypeError：element.addEventListener不是函数

错误。这是因为document.getElementsByClassName返回节点集合，而不是单个节点集合。相反，您应该遍历该集合并将事件附加到每个单独的节点。

var elements = document.getElementsByClassName('cube');
for (var i = 0; i < elements.length; i++) {
  var element = elements[i];
  element.addEventListener('transitionend', showMessage, false);
  // ...
}

Answer 2

您基本上使用多维数据集调用所有元素 - 因此它是一个数组 - 您必须迭代它以向所有元素添加侦听器。 Fiddle Here

var elements = document.getElementsByClassName("cube");

for(var i=0; i<elements.length; i++){
element[i].addEventListener("transitionend", showMessage, false);
element[i].addEventListener('webkitTransitionEnd', showMessage, false);
element[i].addEventListener('oTransitionEnd', showMessage, false);
element[i].addEventListener('transitionend', showMessage, false);
element[i].addEventListener('msTransitionEnd', showMessage, false);
}

CSS中的Transitionend似乎失败了，为什么？

2 个答案: