当输入字段为空时，使用jQuery来防止表单提交

该解决方案应该非常简单。我试图阻止表单在输入框中找不到值时正确提交。这里是我的jsfiddle：http://jsfiddle.net/nArYa/7/当输入字段为空时，使用jQuery来防止表单提交

//标记

<form action="" method="post" name="form" id="form"> 
<input type="text" placeholder="Your email*" name="email" id="email"> 
<input type="text" placeholder="Your name*" autocomplete=off name="name" id="user_name" 
<button type="submit" id="signup" value="Sign me up!">Sign Up</button> 
</form>

// jQuery的

if ($.trim($("#email, #user_name").val()) === "") { 
    $('#form').submit(function(e) { 
     e.preventDefault(); 
     alert('you did not fill out one of the fields'); 
    }) 
}

正如你可以在的jsfiddle看到的，问题是，当我输入一些东西到这两个领域，警报框仍然弹出。我很难弄清楚为什么。（$。trim（$“＃email，＃user_name”）。val（））===“”）？我的 中有什么问题吗？

来源

2013-07-25 LNA

是的，你应该逐个检查每个人，如果你只使用一个选择，只有一个值将返回 –

从文档：获取的当前值**第一**匹配元素集合中的元素 – Barmar

您需要将JavaScript函数附加到您的提交按钮。

两件事，＃1检查空字段应该发生在提交的每一次尝试，＃2你需要逐个检查每个字段

$('#form').submit(function() { 
    if ($.trim($("#email").val()) === "" || $.trim($("#user_name").val()) === "") { 
     alert('you did not fill out one of the fields'); 
     return false; 
    } 
});

Updated fiddle

来源

2013-07-25 17:52:14

直接执行代码if（$ .trim（$（“＃email”）.val（））===“”|| $ .trim（ $（ “＃USER_NAME”）。val（））===“”）{ alert（'你没有填写任何一个字段'）; 返回false; } – gnganpath

您的检查发生在页面加载。表单提交时您需要检查该字段。

$('#form').submit(function(e) { 
    if ($.trim($("#email, #user_name").val()) === "") { 
     e.preventDefault(); 
     alert('you did not fill out one of the fields'); 
    } 
});

来源

2013-07-25 17:49:04

把你如果回调内部声明：

$('#form').submit(function(e) { 
    if ($.trim($("#email").val()) === "" || $.trim($("#user_name").val())) { 
     e.preventDefault(); 
     alert('you did not fill out one of the fields'); 
     //You can return false here as well 
    } 
});

来源

2013-07-25 17:49:47

这不是正确的答案，即使用户名为空也会提交 –

我想，这将有助于：

$('#form').submit(function(e) { 
    e.preventDefault(); 
    $("#email, #user_name").each(function(){ 
     if($.trim(this.value) == ""){ 
      alert('you did not fill out one of the fields'); 
     } else { 
      // Submit 
     } 
    }) 
})

来源

2013-07-25 18:12:21 kitimenpolku

HTML5：在输入标签

一个布尔值属性使用需要。
输入字段必须填写之前提交表格。
适用于文本，搜索，网址，电话，电子邮件，密码，日期选择器，号码，复选框，收音机和文件。
```
<input required type='text'...> 
```

w3schools hint

来源

2016-09-21 07:05:33 Elnaz

如何进入空间？我只是用这个，但它仍然在输入字段中输入空格时提交。 –

然后您可以使用Pattern属性以及必需的。 http://www.felgall.com/html5r.htm将帮助你。（不支持Safari浏览器） – Elnaz

当输入字段为空时，使用jQuery来防止表单提交

回答

相关问题