当要求继续提交表单时,表单发送按钮不会验证表单输入文本字段
Form Send Button Will Not Validate Form Input Text Fields When Asked to Continue Form Submit
我的网页上有一个表单 www.thetotempole.ca,例如它有一个邮政编码文本字段,如果用户没有输入正确的邮政编码,表单将显示一个弹出窗口,说明邮政编码无效。虽然,当用户点击提交时,我希望它显示一个确认弹出窗口,询问他们是否真的要发送表单。这会干扰输入文本字段验证(即邮政编码验证器),最终根本不验证文本字段。任何帮助,不胜感激。谢谢!!
.HTML:
<html>
<head>
<script>
function validate()
{
var myform = document.getElementById("form1");
myform.fname.style.backgroundColor = "white";
myform.lname.style.backgroundColor = "white";
myform.address.style.backgroundColor = "white";
myform.city.style.backgroundColor = "white";
myform.provstate.style.backgroundColor = "white";
myform.country.style.backgroundColor = "white";
myform.postalzip.style.backgroundColor = "white";
console.log("form object: " + myform);
if (myform.fname.value == "")
{
alert("First Name must have a value");
myform.fname.focus();
myform.fname.style.backgroundColor = "red";
return false;
}
if (myform.lname.value == "")
{
alert("Last Name must have a value");
myform.lname.focus();
return false;
}
if (myform.address.value == "")
{
alert("Address must have a value");
myform.address.focus();
return false;
}
if (myform.postalzip.value == "")
{
alert("Postal/Zip Code must have a value");
myform.postalzip.focus();
return false;
}
else
{
//var regex = new RegExp();
var regex = /^([a-z]'d[a-z]'s?'d[a-z]'d)|('d{5}('s?'d{4})?)$/i;
myform.postalzip.value.toUpperCase();
if (!regex.test(myform.postalzip.value))
{
alert("Postal/Zip Code has invalid format");
myform.postalzip.focus();
return false;
}
}
return true;
}
</script>
</head>
<body>
<form id="form1">
First Name:<input type="text" name="fname" /><br />
Last Name:<input type="text" name="lname" /><br />
Address:<input type="text" name="address" /><br />
City:<input type="text" name="city" /><br />
Province/State:<input type="text" name="provstate" /><br />
Country:<input type="text" name="country" /><br />
Postal/Zip Code:<input style="text-transform: uppercase;" type="text" name="postalzip" /><br />
<input type="submit" onclick="return confirm('Do you really want to continue?')" value="Send" />
<input type="reset" onclick="return confirm('Do you really want to reset?')" value="Reset" />
</form>
</body>
</html>
快速修复:
<input type="submit" onclick="return (validate() && confirm('Do you really want to continue?'))" value="Send" />
相关文章:
- 单击禁用表单按钮,然后提交表单
- 如何将POST表单按钮转换为链接
- 按下iframe内部的Youtube订阅表单按钮
- 表单按钮在同一窗口中打开新的URL
- 按下Youtube订阅表单按钮
- 表单按钮上的页面转换
- 禁用表单按钮,除非已填写所有文本输入字段
- 如何查看从 javascript 中的表单按钮提交调用的 php 文件中的回显
- 从“onblur”事件中排除表单按钮,JavaScript
- 触摸启动时显示为灰色的表单按钮
- 如何在表单按钮中使用JavaScript函数
- HTML5表单按钮提交不起作用
- 刮擦:找不到表单按钮
- 保留未保存的表单:按钮提交事件将重置“Changed_Form”状态
- 无法阻止追加在 Jquery UI 对话框上的表单按钮的缺省操作
- iframe 中的表单按钮,单击后,在父窗口中加载
- 在表单按钮css中的文本旁边添加图像
- 使用JavaScript提交特定的表单按钮
- 提交表单按钮在ajax发布后卡住
- 使表单按钮在单击后消失(游戏)