JavaScript에 HTML 변수 전달하기

Question

그래서 손상 계산기를 만들려고합니다. 사용자가 레벨, 군사 등급, 강도 및 무기 수준을 기록합니다. 하지만 문제는 자바 스크립트에 변수를 보낼 수 없으며 문서 쓰기가 아무 것도 보내지 않는 것 같습니다. 코드를 확인하고 도와 줄 수 있습니까? 감사

<form id="form"> 

Your level:<input type="number" name="level"><br> 
Your strength: <input type="number" name="str"><br> 
Your military rank: <input type="number" name="mr"> <br> 
Your weapon(no weapon=0) <input type="number" name="wep"><br> 
<input type="submit" value="Submit">` 
</form> 

<script type="text/javascript"> 
var level = document.getElementById('level').id; 
var str = document.getElementById('str').id; 
var mr = document.getElementById('mr').id; 
var wep = document.getElementById('wep').id; 
hit = ((level*4)+str)*(1+(mr/20))*(1+(wep/10)); 
document.write(hit); 

당신은 요소의 id 싶어하지 않는

Answer 1

:하기 위해,

document.getElementById('level').value 

또한 :

document.getElementById('level').id 

당신은 그것을 값이다 싶어를 getElementById을 사용하려면 요소에 id이 있어야합니다.

또한

<input type="number" name="level" id="level"> 

, 마크 업을 변경하지 않고, 당신은 반환 된 컬렉션의 첫 번째 요소를 getElementsByName를 사용하고 잡아 수 있습니다 : 당신은 getElementById을 사용하고 있지만 ID 값을 정의하지 않은

document.getElementsByName('level')[0].value 

Answer 2

.

현재 html 마크 업으로 getElementsByName()을 대신 사용할 수 있습니다. 이 메서드는 일치하는 요소의 배열을 반환합니다.

Your level:<input type="number" name="level"><br> 

이 있으시면 :

Your level:<input type="number" name="level" id="level"><br> 

귀하의 JS forexample

,

var str = document.getElementsByName('str')[0].value; 

Answer 3

귀하의 문제는 당신이 그것을 하나를 포기하지 않을 때, 태그의 ID를 참조하고 있다는 것입니다 또한 값을 요구하지 않습니다. 그냥 개체를. 다음과 같아야합니다.

var level = document.getElementById('level').value 

그러면 스크립트가 작동합니다.