尝试通过javascript提交html表单变量时没有任何反应
[英]Nothing happens when trying to submit html form variable via javascript
问题描述
I'm a beginner javascript user and I'm trying to get this html form to pass to this javascript function and output the name variable but all that happens when I click the button to submit is that the form input clears and it stays on the form not passing to the javascript. 
我是一个初学者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>
2 个解决方案
解决方案1
1 2013-10-11 05:03:44
When you do document.write(customername); 当你做document.write(customername); after the page has loaded (specifically, after the load event), it will first clear the entire page (including scripts) and write the new content. 页面加载后（特别是在load事件之后），它将首先清除整个页面（包括脚本）并写入新内容。
Instead do something like: 而是执行以下操作：
alert(customername);
Once you clear the alert (eg click "OK"), the form will submit and the page will reload. 清除警报后（例如，单击“确定”），将提交表单并重新加载页面。
Incidentally, since you pass a reference to the function in the call, and the form control has a name, you can use: 顺便说一句，由于您在调用中传递了对该函数的引用，并且表单控件具有名称，因此可以使用：
alert(form.name.value);
Be aware that form control names and IDs are used to create properties of the form object , so having a form control with a name of "name" overwrites the form's own name property (forms also have properties like submit , action , elements , reset and so on). 请注意，表单控件的名称和ID用于创建表单对象的属性，因此拥有名称为“ name”的表单控件会覆盖表单本身的name属性（表单也具有诸如commit ， action ， elements ， reset和依此类推）。 So never use a control name that might be the same as a standard form property name, use things like "userName" or such. 因此，切勿使用与标准表单属性名称相同的控件名称，而应使用“ userName”之类的名称。
Variable names are, by convention, reserved for constructor functions so use lower case for normal functions. 按照惯例，变量名保留给构造函数使用，因此普通函数使用小写字母。 Also, functions are do things so it's generally best to use a verb that describes what it does, eg 另外，函数就是事情，因此通常最好使用动词来描述它的作用，例如
function getUserName(form) {
return form.userName.value;
}
解决方案2
0 已采纳 2013-10-11 05:29:14
Try this: 尝试这个：
<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>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.