0

我是一个初学者 javascript 用户,我试图让这个 html 表单传递给这个 javascript 函数并输出 name 变量但是当我单击按钮提交时发生的所有事情就是表单输入清除并且它停留在表单未传递给 javascript。

 <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>
4

2 回答 2

1

当你document.write(customername);在页面加载完成后(具体来说,在 load 事件之后),它会首先清除整个页面(包括脚本)并写入新的内容。

相反,请执行以下操作:

alert(customername);

一旦您清除警报(例如单击“确定”),表单将提交并且页面将重新加载。

顺便说一句,由于您在调用中传递了对该函数的引用,并且表单控件有一个名称,您可以使用:

alert(form.name.value);

请注意,表单控件名称和 ID 用于创建表单对象的属性,因此使用名称为“名称”的表单控件会覆盖表单自己的名称属性(表单还具有submitactionelementsreset和很快)。所以永远不要使用可能与标准表单属性名称相同的控件名称,使用诸如“userName”之类的东西。

按照惯例,变量名是为构造函数保留的,因此对普通函数使用小写。此外,函数是做事情,所以通常最好使用一个动词来描述它的作用,例如

function getUserName(form) {
  return form.userName.value;
}
于 2013-10-11T05:03:44.107 回答
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>
于 2013-10-11T05:29:14.340 回答