jquery/javascript에서 게임용 다중 키 누르는 방법?

저는 "작은 게임"테스트에서 멀티 키 조합 조합 검증을하려고합니다. 기본적으로 ASDW 키로 이동하는 Mortal Kombat의 캐릭터입니다.하지만 동시에 (예 : S + K) 오리와 블록을 원한다면 어떻게됩니까? 그리고 나는 그것을 작동시키지 못했습니다 : Sjquery/javascript에서 게임용 다중 키 누르는 방법?

지금 ... 나는 S 만 누르면, 오리 것입니다. 그런 다음 K를 누릅니다 (S를 계속 누르고있는 동안). 내가 K를 풀면 계속 망해야한다. 이것도 가능합니까?

예를 들어 자바 스크립트에서 스킬을 처리하는 방법을 처리하는 방법은 무엇입니까? S-> D-> Punch 키를 누르는 것처럼 스킬이 가능합니다 (동시에 눌리지는 않지만 시퀀스가 아닌 경우)

이 모든 작업을 수행 할 수있는 방법이 있습니까?

이

가 PS :에서 캐릭터를 이동하는 동안 프리로드 이미지 부분에 주석 봐, 내 말은, 애니메이션이 고르지입니다 당신이 완전히 볼 수 있도록

이것은 간단한 HTML 안에 내 전체 코드입니다 한 가지 길 ... 다른 이유는 무엇입니까? 내가 도대체 뭘 잘못하고있는 겁니까?

<! DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
    <style> 
    #reptile_wrapper { 
     top: 120px; 
     left: 140px; 
     position:relative; 
    } 

    #container { 
     margin-top: 240px; 
     margin-left: 470px; 
     width: 890px; 
     height: 301px; /* entire one 547px */ 
     background: url("img/bgs/pit_background.png") no-repeat; 
     background-size: 100%; 
    } 

    #pit { 
     top: 0px; 
     position: relative; 
     width: 890px; 
     height: 300px; 
     background: url("img/bgs/pit.png") no-repeat; 
     background-size: 100%; 
    } 

    #pit_chain { 
     position: absolute; 
     width: 150px; 
     height: 340px; 
     background: url("img/bgs/pit_chains.png") no-repeat; 
     margin-left: 695; 
    } 

    </style> 
</head> 
<body> 

<audio src="sounds/mk3thepit.mp3" preload="auto" loop="true" autoplay="true" autobuffer></audio> 
<div id="pit_chain"> 
</div> 
<div id="container"> 
    <div id="pit"> 
    <div id="reptile_wrapper"> 
     <img src="img/reptile_idle.gif"/> 
    </div> 
    </div> 
</div> 

<script> 

    /* Preload all the images and gifs */ 
    function preloadImages(srcs, imgs, callback) { 
    var img; 
    var remaining = srcs.length; 
    for (var i = 0; i < srcs.length; i++) { 
     img = new Image(); 
     img.onload = function() { 
     --remaining; 
     if (remaining <= 0) { 
      callback(); 
     } 
     }; 
     img.src = srcs[i]; 
     imgs.push(img); 
    } 
    } 

    // then to call it, you would use this 
    var imageSrcs = ["img", "img/bgs"]; 
    var images = []; 

    preloadImages(imageSrcs, images, startGame()); 
    /* End of preloading images and gifs */ 

    var duckImages = ["d01", "d02"]; 
    var defaultY = '120px'; 

    reptileIdleAnimation(); 

    function startGame() { 
    var keys = []; 
    window.addEventListener("keydown", 
    function(e){ 
     keys[e.keyCode] = e.keyCode; 
     var keysArray = getNumberArray(keys); 

     if(keysArray.toString() == "68"){ 
     $("#reptile_wrapper img").attr('src', 'img/reptile_walk_forward.gif') 
     .parent().css({left: '+=5px'}); 
     }else if(keysArray.toString() == "17,65"){ 
     // document.body.innerHTML += " Select all!" 
     } 
    }, 
    false); 

    window.addEventListener('keyup', 
    function(e){ 
     keys[e.keyCode] = false; 
     reptileIdleAnimation(); 
    }, 
    false); 

    function getNumberArray(arr){ 
     var newArr = new Array(); 
     for(var i = 0; i < arr.length; i++){ 
     if(typeof arr[i] == "number"){ 
      newArr[newArr.length] = arr[i]; 
     } 
     } 
     return newArr; 
    } 
    } 
</script> 
</body> 
</html>

감사합니다.

출처

2013-12-15 user3078876

나에게 들릴 수있는 소리가 있지만 일부 키보드는 동시에 눌려지는 버튼의 양을 제한하지만 대부분의 현대 키보드에서는 두 가지가 문제가되지 않지만 코드가 없으면 어떻게 문제점을 알 수 있습니까? – adeneo

키 누르는 방법을 알려주십시오. JS 코드를 포함하십시오. – SquareCat

@SquareCat가 내 코드를 게시했습니다. 작동하지 않는 이미지 미리로드를 참조하십시오. 내 코드에서 해당 img.src를 사용해야합니까? :(그러나 어떻게? – user3078876

키를 캡처하기 위해 반드시 jQuery를 사용할 필요는 없습니다. 동시에 여러 키 누름 해제를 감지

var keys = []; 
document.body.innerHTML = "Keys currently pressed: " 
window.addEventListener("keydown", 
    function(e){ 
    keys[e.keyCode] = e.keyCode; 
    var keysArray = getNumberArray(keys); 
    document.body.innerHTML = "Keys currently pressed:" + keysArray; 
    if(keysArray.toString() == "17,65"){ 
     document.body.innerHTML += " Select all!" 
    } 
    }, 
    false); 

window.addEventListener('keyup', 
    function(e){ 
    keys[e.keyCode] = false; 
    document.body.innerHTML = "Keys currently pressed: " + getNumberArray(keys); 
    }, 
    false); 

function getNumberArray(arr){ 
    var newArr = new Array(); 
    for(var i = 0; i < arr.length; i++){ 
    if(typeof arr[i] == "number"){ 
     newArr[newArr.length] = arr[i]; 
    } 
    } 
    return newArr; 
}

당신이 볼 수 있듯이

Here is a plain javascript solution

는 기술적으로 말하면, 문제가되지 않습니다.

여기서 유일한 브라우저 범인은 (일반 JS의 경우) e.keyCode이라고 생각합니다. jQuery를 사용하려면 jQuery를 사용하도록 리스너 정의를 다시 작성할 수 있습니다.

In this question i asked for a proper but plain image preloader.

제공된 답변보기. 이 코드를 사용하여 사전로드를 올바르게 처리 할 수 있습니다.

희망 하시겠습니까?

출처

2013-12-15 17:12:03 SquareCat

좀 보자 :) 만약 내가 버튼 시퀀스를 만들고 싶다면? setTimeout 함수 또는 다른 것을 사용해야합니까? "당신이 A, D, F, G를 1 초도 채 안되어 누르고 있으면 스킬을 던질 것인가?이 접근법이 되겠습니까? – user3078876

안녕하세요, 스퀘어지만 작동하지만 GIF의 애니메이션이 고르지 않은 이유는 무엇입니까? 그 : 당신이 준 프리 로더로 시도해 보겠습니다. – user3078876

아니요 (프리 로더와 함께 사용해 보았는데 여전히 애니메이션이 고르지 않아 업데이트 된 코드이므로 보입니다.) – user3078876

jquery/javascript에서 게임용 다중 키 누르는 방법?

답변

관련 문제