HTML 和 Javascript：表單不會提交。
[英]HTML and Javascript: Form won't submit.
問題描述
所以我有一個非常基本的任務要完成，它是幫助我們學習一些非常基本的 javascript。 我們必須制作一個表單，當您單擊一個按鈕時，它會執行一個 javascript 函數。 我無法弄清楚為什么它無法完成該功能。 有人可以對我的代碼進行故障排除嗎？
<!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
你應該像這樣在 Widget 周圍加上引號：
alert("Thanks," + " " + fname + " " + lname + "for ordering" + num + " " + "Widgets");
你也可能想把';' 最后也是。
給您的快速提示，您可以通過打開 Dev-Console 輕松捕獲此錯誤
在谷歌瀏覽器中按 [Ctrl+Shift+J] 你會看到錯誤顯示。
希望這可以幫助。
解決方案2
0 2015-11-13 03:08:05
用這個代碼再試一次！
<!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
你有沒有嘗試過：
<!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
您將 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 ")
}
你也沒有提到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>
請查看此JSFIDDLE以獲取演示。 希望這是有用的
解決方案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>
使用 Autoform package 和 Meteor Blaze 但表單不會提交。 沒有錯誤
[英]Using Autoform package with Meteor Blaze but form won't submit. No errors
表單提交后，Javascript重定向不起作用。 ASP經典，JavaScript
[英]Javascript redirect not functioning after form submit. Asp Classic, Javascript
<FORM> 如果未選中任何復選框，請提醒！ .. ELSE ..提交。 （JavaScript）的
[英]<FORM> If no checkbox is selected, alert! .. ELSE .. submit. (Javascript)
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.
相關問題
提交時進行JavaScript表單驗證。
JavaScript表單驗證-函數未在提交時運行。
使用 Autoform package 和 Meteor Blaze 但表單不會提交。 沒有錯誤
JavaScript表單無法提交
我的Jade模板按鈕不會提交。 有任何想法嗎？
使用 Javascript 驗證后，HTML 表單不會提交
表單提交后，Javascript重定向不起作用。 ASP經典，JavaScript
<FORM> 如果未選中任何復選框，請提醒！ .. ELSE ..提交。 （JavaScript）的
HTML表單不會在提交時發送電子郵件
JavaScript：為什么我的表單不提交？
相關標簽