HTML 和 Javascript：表单不会提交。
[英]HTML and Javascript: Form won't submit.
问题描述
So I have a very basic assignment to finish and it it is to help us learn some very basic javascript.
所以我有一个非常基本的任务要完成，它是帮助我们学习一些非常基本的 javascript。 We have to make a form and when you click a button it preforms a javascript function.我们必须制作一个表单，当您单击一个按钮时，它会执行一个 javascript 函数。 I can not figure out why it won't complete the function.我无法弄清楚为什么它无法完成该功能。 Can someone troubleshoot my code?有人可以对我的代码进行故障排除吗？
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>Order Page</title> </head> <body> <form> <label>First Name:<input type="text" id="fname" size="30" /><br><br> <label>Last Name:<input type="text" id="lname" size="30" /><br><br> <label>Number of Widgets:<input type="text" id="num" size="4" /><br><br> <button onclick="myFunction()">Send</button> </form> <script> function myFunction() { var fname; var lname; var num; lname = document.getElementById("lname").value; fname = document.getElementById("fname").value; num = document.getElementById("num").value; alert("Thanks," + " " + fname + " " + lname + "for ordering" + num + " " + Widgets) } </script> </body> </html>
5 个解决方案
解决方案1
1 已采纳 2015-11-13 03:07:48
You should put quote around Widget like so:你应该像这样在 Widget 周围加上引号：
alert("Thanks," + " " + fname + " " + lname + "for ordering" + num + " " + "Widgets");
Also you may want to put ';'你也可能想把';' at the end too.最后也是。
Quick tip for you, you can catch this error easily by open a Dev-Console给您的快速提示，您可以通过打开 Dev-Console 轻松捕获此错误
In Google Chrome Press [Ctrl+Shift+J] you will see the error show up.在谷歌浏览器中按 [Ctrl+Shift+J] 你会看到错误显示。
Hope this helps.希望这可以帮助。
解决方案2
0 2015-11-13 03:08:05
Trial again with this code!用这个代码再试一次！
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Order Page</title>
<script type="text/javascript">
function myFunction() {
var fname;
var lname;
var num;
lname = document.getElementById("lname").value;
fname = document.getElementById("fname").value;
num = document.getElementById("num").value;
alert("Thanks, " + fname + " " + lname + "for ordering" + num + " " + "Widgets")
}
</script>
</head>
<body>
<form action="" name="from">
<label>First Name:<input type="text" id="fname" size="30" /><br><br>
<label>Last Name:<input type="text" id="lname" size="30" /><br><br>
<label>Number of Widgets:<input type="text" id="num" size="4" /><br><br>
<input type="button" onclick="myFunction()" value="Trial" />
</form>
</body>
</html>
解决方案3
0 2015-11-13 03:10:27
Have you tried:你有没有尝试过：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>Order Page</title> </head> <body> <form> <label>First Name:</label><input type="text" id="fname" size="30" /><br><br> <label>Last Name:</label><input type="text" id="lname" size="30" /><br><br> <label>Number of Widgets:</label><input type="text" id="num" size="4" /><br><br> <input type="button" onclick="myFunction()" value="Send" /> </form> <script> function myFunction() { var fname; var lname; var num; lname = document.getElementById("lname").value; fname = document.getElementById("fname").value; num = document.getElementById("num").value; alert("Thanks," + " " + fname + " " + lname + "for ordering" + num + " Widgets"); document.document.getElementsByTagName("form")[0].submit(); } </script> </body> </html>
解决方案4
0 2015-11-13 03:18:36
You defined Widgets as variable but it is suppose to be a string.您将 Widgets 定义为变量，但它应该是一个字符串。
function myFunction() {
var fname;
var lname;
var num;
lname = document.getElementById("lname").value;
fname = document.getElementById("fname").value;
num = document.getElementById("num").value;
alert("Thanks, "+fname + " " + lname + " for ordering " + num + " Widgets ")
}
Also you didnt mentioned the button type, so have added it.你也没有提到button类型，所以添加了它。
<form>
<label>First Name:<input type="text" id="fname" size="30" /><br><br>
<label>Last Name:<input type="text" id="lname" size="30" /><br><br>
<label>Number of Widgets:<input type="text" id="num" size="4" /><br><br>
<button onclick="myFunction()" type ="button">Send</button>
</form>
Please check this JSFIDDLE for demo.请查看此JSFIDDLE以获取演示。 Hope this is useful希望这是有用的
解决方案5
0 2015-11-13 03:42:17
var btn = document.getElementById("btn"); btn.onclick = function() { var fname; var lname; var num; lname = document.getElementById("lname").value; fname = document.getElementById("fname").value; num = document.getElementById("num").value; alert("Thanks, " + fname + " " + lname + "for ordering" + num + " " + "Widgets") };
<form onsubmit="return false;"> <label>First Name:<input type="text" id="fname" size="30" /> <br/><br/> <label>Last Name:<input type="text" id="lname" size="30" /> <br/><br/> <label>Number of Widgets:<input type="text" id="num" size="4" /> <br/><br/> <button id="btn">Send</button> </form>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.