个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我有一个敌人、玩家、子弹，敌人有生命值，造成 10 点伤害后，玩家经验值增加 1，然后我的/100 跨度消失。我很困惑为什么要这样做。如果我重新启动程序，它会重新出现。
fiddle :https://jsfiddle.net/tmanrocks999/64thbvm3/
我尝试过创建一个 maxplayerexp var 并稍微改变一下跨度，但当你杀死敌人时它会不断消失(“\100”)。
代码:html/javascript
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Basic Shooter</title>
<style>
canvas {
border: 4px solid #d3d3d3;
background-color: #f1f1f1;
}
</style>
</head>
<body onload="startGame()">
<p>use the arrow keys on you keyboard to move the red square.</p>
<span id="myEnemy1Hp">10</span> <br>
<span id="playerExp">0<span> / <span id = "playerMaxExp">100</span> 🐺
<script>
var myGamePiece;
var endGoalPiece;
var myEnemy1;
var bullets = [];
var myEnemy1Hp = 10;
var damage = 1;
var playerExp = 0;
function startGame() {
myGameArea.start();
myGamePiece = new component(30, 30, "red", 0, 240);
endGoalPiece = new component(30, 30, "black", 450, 240);
myEnemy1 = new component(30, 30, "green", 200, 240);
}
var myGameArea = {
canvas: document.createElement("canvas"),
start: function() {
this.canvas.width = 480;
this.canvas.height = 270;
this.context = this.canvas.getContext("2d");
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
this.interval = setInterval(updateGameArea, 20);
window.addEventListener('keydown', function(e) {
myGameArea.key = e.keyCode;
})
window.addEventListener('keyup', function(e) {
myGameArea.key = false;
})
},
clear: function() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
}
}
function component(width, height, color, x, y) {
this.gamearea = myGameArea;
this.width = width;
this.height = height;
this.speedX = 0;
this.speedY = 0;
//this.gravity = 0.05;
//this.gravitySpeed = 0;
this.x = x;
this.y = y;
this.color = color;
this.update = function() {
ctx = myGameArea.context;
ctx.fillStyle = this.color;
ctx.fillRect(this.x, this.y, this.width, this.height);
}
this.newPos = function() {
this.gravitySpeed += this.gravity;
this.x += this.speedX;
this.y += this.speedY; //+ this.gravitySpeed;
this.hitBottom();
this.hitTop();
this.hitRight();
this.hitLeft();
this.hitObject();
}
this.hitBottom = function() {
var rockbottom = myGameArea.canvas.height - this.height;
if (this.y > rockbottom) {
this.y = rockbottom;
}
}
this.hitTop = function() {
var rockTop = 0;
if (this.y < rockTop) {
this.y = rockTop;
}
}
this.hitRight = function() {
var rockRight = myGameArea.canvas.width - this.width;
if (this.x > rockRight) {
this.x = rockRight;
}
}
this.hitLeft = function() {
var rockLeft = 0;
if (this.x < rockLeft) {
this.x = rockLeft;
}
}
function enemyRespawn() {
myEnemy1 = new component(30, 30, "green", 200, 240);
myEnemy1Hp = 10;
document.getElementById('myEnemy1Hp').innerHTML = myEnemy1Hp;
myStopFunction();
}
this.hitObject = function() {
myGamePiece.update();
var enemy = myEnemy1.x-11;
if (this.x == enemy) {
myEnemy1Hp = myEnemy1Hp - damage;
bullet= 0,0;
document.getElementById('myEnemy1Hp').innerHTML = myEnemy1Hp;
if(myEnemy1Hp <=0){
playerExp = playerExp+1;
document.getElementById('playerExp').innerHTML = playerExp;
myEnemy1 = new component(0, 0, "green", 0, 0);
myEnemy1.update();
setTimeout(enemyRespawn, 5000);
}
}
}
}
function jump() {
myGamePiece.gravitySpeed = -1;
}
function shootGun() {
let bullet = new component(11, 5, "blue", myGamePiece.x + 27, myGamePiece.y + 13);
bullet.newPos();
bullet.speedX = 1;
bullets.push( bullet );
}
function updateGameArea() {
myGameArea.clear();
myGamePiece.speedX = 0;
myGamePiece.speedY = 0;
if (myGameArea.key && myGameArea.key == 37) {
myGamePiece.speedX = -1;
} //left
if (myGameArea.key && myGameArea.key == 39) {
myGamePiece.speedX = 1;
} //right
if (myGameArea.key && myGameArea.key == 38) {
myGamePiece.gravitySpeed = -1;
} //jump
if (myGameArea.key && myGameArea.key == 32) {
shootGun()
} //shoot gun
//if (myGameArea.key && myGameArea.key == 40) {myGamePiece.speedY = 1; }// down
myEnemy1.update();
endGoalPiece.update();
myGamePiece.newPos();
myGamePiece.update();
bullets.forEach( (bullet)=> {
bullet.newPos()
bullet.update();
});
// bullet.newPos();
// bullet.update();
}
</script>
</body>
</html>
我预计当敌人死亡/玩家经验值增加 1 时，\100 的跨度不会从 View 中消失。但目前，只要你杀死敌人，它就会消失。
最佳答案
当您创建<span>时你这样做:
<span id="playerExp">0<span> / <span id = "playerMaxExp">100</span> 🐺
playerExp span 的结束标记缺少斜杠。您有<span>而不是</span> .
将其更改为:
<span id="playerExp">0</span> / <span id="playerMaxExp">100</span> 🐺
关于javascript - 一旦玩家经验增加 1，我的跨度就会不断消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58634294/
24
4
0
这个问题在这里已经有了答案: What does the question mark character ('?') mean in C++? (8 个答案) 关闭 7 年前。 这一行我看不懂为什么
在构建模式下甚至可以有两个玩家吗？查看 Roblox 开发者杂志文章“What did you sleigh?”，它在玩家列表中显示了两个“玩家”。 最佳答案 打开 Roblox Studio 转到任
在构建模式下甚至可以有两个玩家吗？查看 Roblox 开发者杂志文章“What did you sleigh?”，它在玩家列表中显示了两个“玩家”。 最佳答案 打开 Roblox Studio 转到任
关闭。这个问题需要更多focused .它目前不接受答案。 想改进这个问题吗？ 更新问题，使其只关注一个问题 editing this post . 关闭 5 年前。 Improve this qu
“Clash of Clans”使用 Game Center 对玩家进行身份验证并将其与现有的远程存储游戏状态相关联。 据我所知，游戏仅在客户端提供玩家标识符。是否有支持的技术来安全地验证用户而不是仅
我正在开发多人游戏，但我无法找出如何将其他客户端连接到创建的游戏。我的意思是客户端 A 创建到服务器的套接字连接，其他客户端(A，B ...)如何连接到客户端 A？有人可以帮我吗？ 附注我是网络编程新
我正在尝试使用浏览器控制台一步一步地制作井字游戏，并最终改进我的功能。然而，我被困在玩家2回合(ttt_player2_turn())，我必须检查箱子是否为空。看来我在这个例子中的论证有问题。感谢您的
如果我向上移动玩家 1 和玩家 2，假设我按下玩家 1 的向下键，我的玩家将停止向上移动。我找不到问题所在。有人可以帮助我并解释我做错了什么吗？ package game; import java.a
我正在创建一个自上而下的 2D 游戏，并且使用 Box2D 来模拟物理，我的问题是: 如何使玩家保持与我的宇宙飞船的相对速度，并且仍然能够在飞船也在移动的情况下围绕我的玩家移动？ 我在下面放了一个插图
我是 Java 新手，我正在尝试制作一个简单的游戏来娱乐。我首先尝试将 repaint 放入 PaintComponent() 中，它一直有效，直到我尝试添加一些背景。有谁知道如何让我的玩家在有或没有
//我正在尝试对玩家 2 的代码进行一些编辑，因此我删除了涉及玩家 1 的所有内容。但出于某种原因，如果没有玩家 1 的代码，玩家 2 根本不会执行任何操作。(假设使用 i、j、k 和 l 键 mov
我接到了一项任务，要编写一个由人类玩家和 AI 玩家组成的 NIM 游戏。游戏是“Misere”(最后一个必须拿起一根棍子的人输了)。 AI 应该使用 Minimax 算法，但它正在采取使其输得更快的
我是一名优秀的程序员,十分优秀！