我正在写一个太空入侵者游戏代码,我不知道如何用子弹杀死外星人。当船和子弹从顶部和左边到达相同的位置时,我尝试移除元素,但它不适用于我,我不知道它的实现是错还是想法本身。 (长而丑陋的代码,我知道,但请告诉我,如果你有任何建议可以改善它,我还是初学者:D)
<script>
$(document).ready(function () {
var key = {l: 0, r: 0, s: 0};
//arrow keys and spacebar down
$(document).keydown(function (e) {
switch (e.keyCode) {
case 37: //left arrow
key.l = 1;
break;
case 39: //right arrow
key.r = 1;
break;
case 32: //spacebar
key.s = 1;
break;
}
});
//arrow keys and spacebar up
$(document).keyup(function (e) {
switch (e.keyCode) {
case 37: //left arrow
key.l = 0;
break;
case 39: //right arrow
key.r = 0;
break;
case 32: //spacebar
key.s = 0;
break;
}
});
Movement();
//the movement of the ship with the arrow keys and shooting usnig spacebar
function Movement() {
requestAnimationFrame(Movement);
if ($('.bullet').length > 0) {
$('.bullet').css({"top": "-=20"});
if ($('.bullet').position().top < 0)
$('.bullet').remove();
}
if($('#ship').position().left>890 )
key.r=0;
else if($('#ship').position().left<=0)
key.l=0;
if (key.l) {
$("#ship").css({"left": $('#ship').position().left - 10})
}
if (key.r) {
$("#ship").css({"left": $('#ship').position().left + 10})
}
if (key.s) {
$('#myDiv').append('<img class="bullet" src="bullet.png" width="40" height="100">');
if($())
$('.bullet').css({
"position": "absolute",
"top": $('#ship').position().top - 100,
"left": $('#ship').position().left + 30
});
}
}
createAliens();
//creating aliens
function createAliens() {
for(var i=1;i<=10;i++) {
$('#myDiv').append('<img id="alien'+i+'" src="alien.ico" width="70" height="70">');
}
$('#alien1').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien2').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien3').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien4').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien5').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien6').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien7').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien8').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien9').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
$('#alien10').css({
position: "absolute",
left: parseInt(Math.random() * 940 + 1)
});
timer();
}
//timer for aliens to move from top to bottom
function timer() {
var delay1=parseInt(Math.random()*(3000-1000)+1000);
var delay2=parseInt(Math.random()*(3000-1000)+1000);
var delay3=parseInt(Math.random()*(3000-1000)+1000);
var delay4=parseInt(Math.random()*(3000-1000)+1000);
var delay5=parseInt(Math.random()*(3000-1000)+1000);
var delay6=parseInt(Math.random()*(3000-1000)+1000);
var delay7=parseInt(Math.random()*(3000-1000)+1000);
var delay8=parseInt(Math.random()*(3000-1000)+1000);
var delay9=parseInt(Math.random()*(3000-1000)+1000);
var delay10=parseInt(Math.random()*(3000-1000)+1000);
setInterval(function () {
$('#alien1').css({
top: "+=20"
});
if ($('#alien1').position().top > 450){
$('#alien1').remove();
location.reload();}
},delay1);
setInterval(function () {
$('#alien2').css({
top: "+=20"
});
if ($('#alien2').position().top > 450){
$('#alien2').remove();
location.reload();}
}, delay2);
setInterval(function () {
$('#alien3').css({
top: "+=20"
});
if ($('#alien3').position().top > 450){
$('#alien3').remove();
location.reload();}
}, delay3);
setInterval(function () {
$('#alien4').css({
top: "+=20"
});
if ($('#alien4').position().top > 450){
$('#alien4').remove();
location.reload();}
},delay4);
setInterval(function () {
$('#alien5').css({
top: "+=20"
});
if ($('#alien5').position().top > 450){
$('#alien5').remove();
location.reload();}
},delay5);
setInterval(function () {
$('#alien6').css({
top: "+=20"
});
if ($('#alien6').position().top > 450){
$('#alien6').remove();
location.reload();}
}, delay6);
setInterval(function () {
$('#alien7').css({
top: "+=20"
});
if ($('#alien7').position().top > 450){
$('#alien7').remove();
location.reload();}
},delay7);
setInterval(function () {
$('#alien8').css({
top: "+=20"
});
if ($('#alien8').position().top > 450){
$('#alien8').remove();
location.reload();}
},delay8);
setInterval(function () {
$('#alien9').css({
top: "+=20"
});
if ($('#alien9').position().top > 450){
$('#alien9').remove();
location.reload();}
}, delay9);
setInterval(function () {
$('#alien10').css({
top: "+=20"
});
if ($('#alien10').position().top > 450){
$('#alien10').remove();
location.reload();}
}, delay10)
}
});
</script>