如何获取我的表格'；Javascript错误函数取消表单提交并插入错误消息？
我在这里读了几篇关于堆栈溢出的文章，并阅读了关于Javascript和HTML表单的W3学校教程 我正在创建一个带有必填字段的如何获取我的表格'；Javascript错误函数取消表单提交并插入错误消息？,javascript,html,forms,xhtml,Javascript,Html,Forms,Xhtml,我在这里读了几篇关于堆栈溢出的文章，并阅读了关于Javascript和HTML表单的W3学校教程 我正在创建一个带有必填字段的XHTML表单，供用户提交个人数据（姓名、地址、电话）。我希望onsubmit属性将每个输入值作为参数传递给我的外部javascript函数website\u form\u error（） 我希望website\u form\u error（）函数在用户未填写所有所需字段时，取消表单提交并重定向回表单，并在中插入消息。 Mywebsite\u form\u error（）
XHTMLonsubmitwebsite\u form\u error（）website\u form\u error（）My
website\u form\u error（）处理程序属性应返回false
以取消提交。尝试使用onsubmit=“return website\u form\u error（…）”
并从website\u form\u error
返回一个false
来取消提交。您的脚本应该如下所示：
function website_form_error(Name,Address,Phone)
{
var = Name,Address,Phone,response ;
response = (Name,Address,Phone == undefined)
document.getElementById("frm_responder").innerHTML = response ;
if(!response){
"Your specifications have been sent to Other Mind Paradigm";
return true;
}else{
"Form incomplete. You must fill in all required fields." ;
return false;
}
}
以及您的HTML代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<script src="http://othermindparadigm.com/web_frm_err.js" type="text/javascript"></script>
</head>
<body>
<p class="mid" id="frm_responder"> </p>
<form action="/webformmailer.php" method="post" onsubmit="javascript:website_form_error(document.getElementById('Name').value,document.getElementById('Address').value,document.getElementById('Phone').value)">
<p>
* Name <input class="norm" type="text" name="Name" />
* Address <input class="norm" type="text" name="Address" />
* Phone <input class="norm" type="text" name="Phone" />
</p>
<input type="submit" onclick="return website_form_error()"/>
</form>
</body>
</html>
*名字
*地址
*电话
我认为您应该使用simple按钮而不是submit按钮，在simple按钮上添加onclick事件的自定义方法，并在该自定义方法中使用submit（）。经过几天的沮丧和阅读、研究、阅读、搜索之后，我得到了要取消的表单和插入的错误消息，而无需事件传播。当用户完成必填字段时，表单将被发送。我有一个挣扎，因为我在表单中有一个复选框。应将复选框的选中状态作为布尔值调用，以便于验证document.getElementById（“Agree”）。选中的是，而不是它们的值，因为这成了试图解决的噩梦
我的外部Javascript/web\u frm\u err.js
。这是我能得到的最简单的。每个参数名称、电话、电子邮件、主题、图像、同意
在函数参数中被分配一个新变量名（n、p、e、t、i、a）
function website_form_error(n , p , e , t , i , a)
{
var att = document.getElementById("err") ;
if ((n != "") && (p != "") && (e != "") && (t != "") && (i != "") && (a == true))
{
return true ;
}
else
{
att.innerHTML = "Form incomplete. You must complete all required (*) fields." ;
att.style.color = "Red" ;
return false ;
}
}
我的XHTML表单：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<script src="/web_frm_err.js" type="text/javascript"></script>
</head>
<body>
<form onsubmit="javascript:return website_form_error(document.getElementById('Name').value , document.getElementById('Phone').value , document.getElementById('Email').value , document.getElementById('Theme').value , document.getElementById('Images').value , document.getElementById('Agree').checked)" action="/webformmailer.php" method="post">
* Name <input type="text" id="Name" />
<br /> * Phone <input type="text" id="Phone" />
<br /> * Email <input type="text" id="Email" />
<br /> * Theme <input type="text" id="Theme" />
<br /> * Images <input type="text" id="Images" />
<br /> * Do you agree? <input type="checkbox" id="Agree" />
<p id="err"></p>
<br /><input type="submit" value="Send" />
</form>
</body>
</html>
*名字
*电话
*电子邮件
*主题
*图像
*你同意吗？
谢谢这很有意义，这也是我想要的方式，但出于某种原因，无论必填字段是否已填写，表单仍会发送，并且我的webformmailer.php仍会重定向到我的thankyou.html页面。使用脚本尝试了多种方法，但结果仍然相同。还尝试删除了重定向到我的主页的隐藏输入，服务器重定向到我的主页。我认为您的验证代码不起作用，请检查此项。当您的代码返回false
，提交将不会重定向您的页面。我认为您的验证返回了true
。我终于得到了我想要的结果。谢谢。我的最终答案与此相去甚远，因为它已经进化了，但主体仍然是无效的，但有一些缺点。您的意思是将onsubmit
属性添加到
标记还是input
submit？添加到
标记。它已经有一个了。在函数调用之前添加return
。我还尝试删除
，用户被重定向到home pafge。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<script src="/web_frm_err.js" type="text/javascript"></script>
</head>
<body>
<form onsubmit="javascript:return website_form_error(document.getElementById('Name').value , document.getElementById('Phone').value , document.getElementById('Email').value , document.getElementById('Theme').value , document.getElementById('Images').value , document.getElementById('Agree').checked)" action="/webformmailer.php" method="post">
* Name <input type="text" id="Name" />
<br /> * Phone <input type="text" id="Phone" />
<br /> * Email <input type="text" id="Email" />
<br /> * Theme <input type="text" id="Theme" />
<br /> * Images <input type="text" id="Images" />
<br /> * Do you agree? <input type="checkbox" id="Agree" />
<p id="err"></p>
<br /><input type="submit" value="Send" />
</form>
</body>
</html>