[英]How to Order Sequence between html tag “Required” and javascript “onClick”
我有一个简单的表单，可以将项目添加到使用PHP构建的数据库中。 我这样使用html属性Required：
<input type="text" name="iditem" required/>
为了防止在将空白值发送到数据库中时使用提交按钮。
我在提交按钮上也有javascript“ onClick”，如下所示：
<input type="submit" onClick="return confirm('Add this item?')" />
我想问的是...如何使必填属性可以在提交按钮之前先执行？
多谢你们...
您可以在<form>使用“ onsubmit”参数，并避免在“提交”按钮上使用“ onclick”：
<form action="test2.php" onsubmit="return confirm('Add this item?')" > <input type="text" required /> <input type="submit" /> </form>
<!DOCTYPE html> <html> <body> <form action=""> Username: <input type="text" name="usrname" required> <input type="submit"> </form> </body> </html>
这里的一种简单方法是使用普通JavaScript来完成所有繁重的工作。 让我们快速看一下。
首先我们列出HTML表单
<!DOCTYPE html>
<html>
<body>
<form action="/" method="post" onsubmit="return validateForm();">
Username: <input id="username" type="text" name="username">
<input type="submit">
</form>
</body>
</html>
现在，请注意form指令，其中提到method ， action和onsubmit 。 让我们逐一讨论所有这些内容。
我确定您完全知道什么method和action ，但是对于onsubmit部分，它链接到一个称为validateForm()的JavaScript函数，其定义如下：
function validateForm() {
var username = document.getElementById( 'username' ).value;
if( !username ) {
return false;
}
return true;
}
该函数获取表单中username元素的值，如果为空，则返回false ，否则返回true 。 这样做是为了告诉事件触发器，如果结果值是true ，则使用method动词将表单提交给action 。 如果它为false ，那么它将停止执行。 就像我们使用return关键字来中断当前控件一样。
因此，以某种方式，它是在onClick处理程序之前触发的。 从某种意义上说， 如果验证失败，它不会让表单过帐，这是非常微妙的方式。
现在，当然，您可以通过添加confirm对话框来编辑它以满足您的需要，因为如果按下OK或YES ，它将返回true否则返回false 。 但这应该为您提供一个很好的示例，说明您可以使用onsubmit属性 ，以及通常使用event属性 。
我希望这回答了你的问题！ 你可以在这里找到一个小提琴。
Javascript onclick确认不适用于“必需”标记HTML
[英]Javascript onclick confirm not working with “required” tag HTML
如何直接在 JavaScript 代码中实现 onclick 功能而不是 html 标签？
[英]How to implement onclick function directly in JavaScript code instead of html tag?
如何在忽略 JavaScript 中的 HTML 标签的两个索引之间替换 substring
[英]How to replace a substring between two indexes ignoring HTML tag in JavaScript
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.