텍스트 기반 게임 코드가 작동하지 않습니까?

텍스트 기반 HTML 게임을 만들려고합니다. jQuery에서 내 .append 메서드가 작동하지 않습니다. 내가 그것에 단락 태그를 append()하면 초를 표시하고 사라집니다. 도와주세요텍스트 기반 게임 코드가 작동하지 않습니까?

여기 내 코드입니다 :

<!DOCTYPE html> 
<html> 
<head> 
<title>game</title> 
<style> 
</style> 
</head> 
<body> 
<script type="text/javascript" src="jquery-3.2.1.min.js"></script> 
<script type="text/javascript"> 
/*var input; 
var room; 


function submitFunction() { 
    alert("hello") 
} 
*/ 
</script> 
<script type="text/javascript"> 
    var input; 
    var room; 
    room = "Main Enterence" 



    $(document).ready(function() { 
     $("#mainForm").submit(function() { 
      input = document.getElementById("textInput").value; 


      if (input == "east") { 
       if (room == "Main Enterence") { 
        room = "Bedroom" 
        enterBedroom(); 
       } 

      } 
      if (input == "west") { 

      } 
      if (input == "north") { 

      } 
      if (input == "south") { 

      } 


     }) 
    }) 

function enterBedroom() { 
    $("#consoleOutput").append("<p>Test</p>"); 

} 
</script> 


<div id="consoleOutput"> 
    <p id="welcomeText"></p> 
</div> 

<form onsubmit="submitFunction()" id="mainForm"> 
    <input type="text" id="textInput"> 
    <input type="submit" name="sumbit"> 
</form> 


</body> 
</html>

안녕하세요, 텍스트 기반의 HTML 게임을 만들기 위해 노력하고 . jQuery에서 내 .append 메서드가 작동하지 않습니다. 내가 그것에 단락 태그를 append()하면 초를 표시하고 사라집니다. 제발 도와주세요

출처

2017-11-14 SurajRam123

, 당신 또한 jquery submit 이벤트 핸들러를 사용한다면'onsubmit = "submitFunction()"'이 필요 없다. –

페이지가 새로 고쳐지기 때문에 이런 일이 발생합니다 - 양식을 제출하십시오. 당신은 이벤트를 제출하고 그것을 당신이 페이지가/새로 고침을 다시로드의 원인이되는 제출 사용하고 있기 때문에 그것은 웁니다

$("#mainForm").submit(function(event) { 
    event.preventDefault(); 
});

출처

2017-11-14 12:50:36 Sylwek

작동했습니다, 고맙습니다 – SurajRam123

에 preventDefault() 기능을 사용하려면 먼저 parametr을 추가해야합니다. 그

당신의 HTML 버튼을 클릭하여 변경 :

<input type="button" name="sumbit" id="submit" value="submit">

당신의 JS :

$(document).ready(function() { 
    $("#submit").click(function() { 
. 
. 
.

출처

2017-11-14 12:53:51

오류 :

형태의 제출시 호출 두 가지 기능이 있습니다. ..
...이 아닌 기본 이벤트을 방지하지 않고 를 제출 사용하지 않는 다음 새로 페이지를 필요

솔루션 : Sylwek 응답에 추가

var input; var room; room = "Main Enterence"; $("#mainForm").click(function() { input = document.getElementById("textInput").value; if (input == "east") { if (room == "Main Enterence") { room = "Bedroom" $("#consoleOutput").append("<p>Test</p>"); } } if (input == "west") { } if (input == "north") { } if (input == "south") { } });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="consoleOutput"> <p id="welcomeText"></p> </div> <form id="mainForm"> <input type="text" id="textInput"> <input type="button" value="submit" name="submit"> </form>

출처

2017-11-14 13:01:41

틀렸어요. submit을 사용할 수는 있지만, 이벤트에'preventDefault()'함수를 사용하여 리프레시를 막아야합니다. – Sylwek

편집 ... 죄송합니다. –

텍스트 기반 게임 코드가 작동하지 않습니까?

답변

관련 문제