如何让原型在JavaScript中使用构造函数
我想创建如何让原型在JavaScript中使用构造函数,javascript,prototype,Javascript,Prototype,我想创建StartCountdownConstructor函数的原型函数,以了解如何正确地完成此操作 这是没有原型的完整版本 而不是 var StartCountdown = function () { //grab value from the input text field var minutes = document.getElementById("minutes").value; //check if the value passed is a number if
StartCountdown
Constructor函数的原型函数,以了解如何正确地完成此操作
这是没有原型的完整版本
而不是
var StartCountdown = function () {
//grab value from the input text field
var minutes = document.getElementById("minutes").value;
//check if the value passed is a number
if (isNaN(minutes)) {
timeDisplay.innerHTML = "Enter a numeric value";
return;
};
//this variable will decrement
secondsRemaining = minutes * 60;
//the ticking function and the milisecond (1)
// calls the method repeatedly
intervalHandle = setInterval(tick, 1000);
//hide the input field once we have the numeric value
// document.getElementById("inputArea").style.display = "none";
StartCountdown.closeInputField;
};
StartCountdown.prototype = {
closeInputField: function() {
document.getElementById("inputArea").style.display = "none";
}
}
您需要使用调用函数
StartCountdown.closeInputField;
注意:确保使用()
调用函数。没有它们,您只是引用函数,而不是调用它
您也不必以这种方式创建原型 创建函数后,只需附加到现有原型即可
this.closeInputField();
在看了你的小提琴之后,我也看到了一些其他需要改进的地方。这些只是一些你想用的想法 计时器 多定时器
var timer = document.getElementsByTagName("div")[0];
new Timer(timer);
var timers=document.getElementsByTagName(“div”);
对于(var i=0,len=timers.length;iDefine在定义构造函数后定义原型,而不是在其中。@PaulS。我也这么认为,因为括号似乎有点错,但原型不在构造函数中。如果您使用的是希望以后访问的变量,则应使用this.minutes
而不是“var minute”来指定它们或者,一旦创建了实例,它们就不可用。可以在此处找到使用构造函数和原型的介绍:
var Timer = function(elem) {
this.seconds = 0;
this.elem = elem;
this.initialize();
};
Timer.prototype.initialize = function() {
this.timer = document.createElement("span");
this.timer.innerHTML = "0:00";
this.input = document.createElement("input");
this.button = document.createElement("button");
this.button.innerHTML = "Submit";
this.button.addEventListener("click", this.startTimer.bind(this));
this.elem.appendChild(this.timer);
this.elem.appendChild(this.input);
this.elem.appendChild(this.button);
};
Timer.prototype.startTimer = function(event) {
this.removeInput();
this.seconds = parseInt(this.input.value) * 60;
this.interval = window.setInterval(this.countDown.bind(this), 1000);
event.preventDefault();
};
Timer.prototype.stopTimer = function() {
this.updateTimer("Done!");
window.clearInterval(this.interval);
};
Timer.prototype.updateTimer = function(text) {
this.timer.innerHTML = text;
};
Timer.prototype.countDown = function() {
if (this.seconds === 0) {
return this.stopTimer();
}
this.updateTimer(this.timeRemaining(this.seconds));
this.seconds--;
};
Timer.prototype.timeRemaining = function(seconds) {
var minutes = Math.floor(seconds/60),
seconds = seconds % 60,
separator = seconds % 2 === 0 ? ":" : " ";
if (seconds.toString().length < 2) {
seconds = [0, 0, seconds].slice(-2).join("");
}
return minutes + separator + seconds;
};
Timer.prototype.removeInput = function() {
this.input.remove();
this.button.remove();
};
var timer = document.getElementsByTagName("div")[0];
new Timer(timer);
var timers = document.getElementsByTagName("div");
for (var i=0, len=timers.length; i<len; i++) {
new Timer(timers[i]);
}