如果表单没有有效值,则显示alert()对话框
Showing an alert() dialog box if a form does not have valid values
我有一个简单的表单,它接受来自文本框和文本区域的Title和Contents变量。表单将把它的数据发送到一个名为add-post.php
的文件。然而,我正在寻找一种方法来提醒用户,无论是文本框或文本区域有无效的数据(空),如果他们点击提交按钮。
我认为alert()
弹出框将是最好的主意,因为它不会重定向到任何其他页面,用户永远不会丢失他们的数据(想象他们输入了一大堆文本,但忘记了标题)。将数据发送到add-post.php
并在那里执行检查将导致用户的数据丢失。
然而,我不确定如何实际实现alert()
弹出。我将如何使它,使检查完成后,他们已经点击提交按钮,但之前的数据被发送到下一个文件。
在表单上添加如下内容
<form name="frm1" onsubmit="InputChecker()">
在javascript中
<script type="text/javascript">
function InputChecker()
{
if(document.getElementById({formElement}) != '') { // not empty
alert("This element needs data"); // Pop an alert
return false; // Prevent form from submitting
}
}
</script>
也正如其他人所说,jQuery使这更容易一些。我强烈推荐jQuery Validate Plugin
有些人确实觉得警告框"很烦人",所以最好在DOM中附加一条消息,让用户知道需要修复什么。如果有很多错误,这是有用的,因为错误将更加持久,允许用户看到他们需要修复的所有东西。同样,jQuery Validate插件内置了这个功能。
为表单添加onsubmit
事件,并在检查失败时添加return false;
事件以停止提交
使用Javascript进行表单验证。或者使用jQuery更容易。
基本上,在单击提交按钮时验证表单(使用onsubmit处理程序),然后在需要时使用alert()框。顺便说一下,人们通常讨厌警告框。
当涉及到客户端验证时,您有许多选择。
<form id="tehForm" method="post">
<input type="text" id="data2check" >
<input type="button" id="btnSubmit" />
</form>
<script type="text/javascript">
function submit_form(){
if(document.getElementById("data2check").value!="correct value"){
alert("this is wrong");
}else{
document.getElementById("tehForm").submit();
}
}
</script>
有关更深入的示例,请查看此链接
相关文章:
- Bootstrap Alert只显示一次
- Javascript alert()在没有const字符串的情况下不显示
- alert()和confirm()未显示在iframe的父级上
- 使用Alert()显示实际的HTML代码
- 字符串比较显示从flash[:alert]检索到的字符串上的错误
- 谷歌浏览器不显示一个站点的alert()弹出窗口
- 用于表单验证的 jQuery post 函数只允许 alert() 显示返回的数据
- IE:jQuery.show() 仅在显示之前/之后使用 alert() 时显示元素
- 如何在 javascript alert中显示 instagram API 响应
- 在成功上传文件时显示 Javascript alert()
- js alert-box/lightbox根据querystring中的值显示不同的消息
- javascript:如何在window.alert中显示html文件
- window.alert消息未显示Sqlite行数据
- 如何清理异常字符串以便通过Javascript Alert显示
- 显示数字时附加alert()
- 从php和alert加载文本——alert框中没有显示任何内容
- alert()不会'不要在Tampermonkey脚本中显示值
- alert()在加载jQuery文档就绪处理程序时未显示
- 函数中的JavaScript Alert和Prompt不会在浏览器中显示
- Javascript: alert显示不止一次