这是我到目前为止所得到的,它根本不起作用:(我的播放器类中的所有变量都为null,并且永远不会调用更新.
我的意思是编程类,而不是css类. I.E.不是(.movingdiv {color:#ff0000;})
<!DOCTYPE html> <html lang="en"> <head> <title>Class Test</title> <Meta charset="utf-8" /> <style> body { text-align: center; background-color: #ffffff;} #Box { position: absolute; left: 610px; top: 80px; height: 50px; width: 50px; background-color: #ff0000; color: #000000;} </style> <script type="text/javascript"> document.onkeydown=function(event){keyDown(event)}; document.onkeyup=function(event){keyUp(event)}; var Box = 0; function Player () { var speed = 5; var x = 50; var y = 50; } function update() { Box.style.left = this.x + "px"; Box.style.top = this.y + "px"; Box.innerHTML = "<h6 style=\"margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;\">X: "+ this.x + "<br /> Y: " + this.y + "</h6>"; } var player = new Player(); var keys = new Array(256); var i = 0; for (i = 0;i <= 256; i++){ keys[i] = false; } function keyDown(event){ keys[event.keyCode] = true; } function keyUp(event){ keys[event.keyCode] = false; } function update(){ if(keys[37]) player.x -= player.speed; if(keys[39]) player.x += player.speed; player.update(); } setInterval(update,1000/60); </script> </head> <body> <div id="Box" ></div> <script type="text/javascript"> Box = document.getElementById('Box'); Box.innerHTML = "<h6 style=\"margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;\">X: "+ player.x + "<br /> Y: " + player.y + "</h6>"; </script> </body> </html>
编辑:好吧,我想我搞砸了.我第一次尝试上课时似乎搞砸了.重试后,我似乎能够在Meders帖子中使用“1 Using a function”.
真正的问题似乎是javascript在我的实际代码中到达这一行时不知道该怎么做:
Box.style.background-position = "" + -(this.frame * this.width) + "px " + -(this.state * this.height) + "px";
我放的时候似乎也会窒息
Box.style.background色
所以我现在需要回答的问题是如何在javascript中设置一个样式变量,名称中带有“ – ”.我会在一秒钟内发布测试
解决方法
根据
this文章,有三种方法可以在JavaScript中定义类:
1使用功能
例:
function Apple (type) { this.type = type; this.color = "red"; this.getInfo = getAppleInfo; } function getAppleInfo() { return this.color + ' ' + this.type + ' apple'; } var apple = new Apple('macintosh'); apple.color = "reddish"; alert(apple.getInfo());
2使用JSON
var apple = { type: "macintosh",color: "red",getInfo: function () { return this.color + ' ' + this.type + ' apple'; } } apple.color = "reddish"; alert(apple.getInfo());
3单身使用功能
var apple = new function() { this.type = "macintosh"; this.color = "red"; this.getInfo = function () { return this.color + ' ' + this.type + ' apple'; }; } apple.color = "reddish"; alert(apple.getInfo());