2013-10-11 2 views
0

초보자 용 자바 스크립트 사용자이고이 HTML 양식을이 자바 스크립트 함수로 전달하고 이름 변수를 출력하려고합니다. 버튼을 클릭하면 양식 입력이 지워지고 자바 스크립트로 전달되지 않는 양식에 그대로 남아있게됩니다.javascript를 통해 html 양식 변수를 제출할 때 아무런 변화가 없습니다.

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 



    <title>Life Insurance Calculator</title> 


     <script type="text/javascript"> 

     var title = "Welcome to Life Insurance Co..!"; 
        //Declaring variable title    

     document.writeln(title.fontsize(8).fontcolor('red')); 
        //Printing out the title on the page 

     function Name(form){ 

     var customername = document.getElementByID("name").value; 
     document.write(customername); 
    } 

    </script> 


</head> 

<body> 



    <form name = "LifeCalcForm" action="" method="get"> 
    <p>To get a life insurance quote, please tell us about yourself.</p> 
    <p><i>Note:only those under the age of 80 and non-smokers may apply</i></p> 
    <p>Enter your name: <input type="text" name="name" /></p> 



    <input type="submit" value="Calculate" onClick="Name(this.form)"> 
     </form> 


    </body> 

</html> 
+0

"자바 스크립트 제출"- 당신은 무엇을 의미합니까? – Alex

+0

자바 스크립트 함수가 호출되지 않고 이름을 출력하지 않습니다. – user2869602

+0

onload가 실행 된 후에는'document.write'를 사용할 수 없습니다. 당신의 경우에 온로드 (onclick)가 온로드 후에 거의 확실하게 발생하기 때문에 이런 일이 발생합니다. 그 중에서도 기본 제출 동작을 방지하기 위해'onclick'에서'false를 반환해야합니다. – Steve

답변

0

이 시도 :

<html> 

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 



     <title>Life Insurance Calculator</title> 


      <script type="text/javascript"> 

    var title = "Welcome to Life Insurance Co..!"; 
// Declaring variable title 

    document.writeln(title.fontsize(8).fontcolor('red')); 
// Printing out the title on the page 

    function Name(){ 
     var customername = document.getElementById("name").value; 
     document.write(customername); 
    } 

</script> 


    </head> 

    <body> 



     <form name = "LifeCalcForm" action="" method="get"> 
    <p>To get a life insurance quote, please tell us about yourself.</p> 
    <p><i>Note:only those under the age of 80 and non-smokers may apply</i></p> 
    <p>Enter your name: <input type="text" id="name" name="name" /></p> 



    <input type="button" value="Calculate" onClick="Name()"> 
</form> 


     </body> 

    </html> 
+0

감사합니다. Vicky, 이것은 정확히 내가 원래 찾고 있었던 것입니다! – user2869602

+0

언제든지 :) :) :) :) –

1

당신은 페이지가로드 된 후 (특히,로드 이벤트 후) 처음 (스크립트 포함) 전체 페이지를 취소하고 새로운 콘텐츠를 작성합니다 document.write(customername); 할 때.

가 대신 같은 것을 할 : 당신이 경고를 취소하면

alert(customername); 

을 (예를 들어, "OK"를 클릭), 양식을 제출하고 페이지가 다시로드됩니다. 덧붙여

, 당신은 호출 함수에 대한 참조를 전달하고, 폼 컨트롤에 이름이 있기 때문에, 당신은 사용할 수 있습니다

alert(form.name.value); 

그 폼 컨트롤 이름을 인식하고 ID를 속성을 만드는 데 사용됩니다 form object의, 그래서 "이름"의 이름을 가진 폼 컨트롤을 갖는 형태로 자신의 이름 속성 (형태 또한, 같은 속성 제출해야 행동, 요소, 등등를 재설정)을 덮어 씁니다. 따라서 표준 양식 속성 이름과 동일한 제어 이름을 사용하지 마십시오. "userName"등과 같은 것을 사용하십시오.

일반적으로 변수 이름은 생성자 함수 용으로 예약되어 있으므로 일반 함수에는 소문자를 사용하십시오. 또한 함수는 일을 수행하므로 일반적으로 어떻게 동작하는지 설명하는 동사를 사용하는 것이 가장 좋습니다.

function getUserName(form) { 
    return form.userName.value; 
} 
+0

답변 해 주셔서 대단히 감사합니다. Rob, 나는 Vicky의 솔루션을 원래 찾고 있었기 때문에 답변을 수락했지만 솔루션과 팁에 감사드립니다. – user2869602

관련 문제