包含jQuery时HTML5验证不起作用

因此，我有一个html5必需的输入字段，当我省略以下jQuery确认警报时，它可以正常工作

$(".acal-confirm").click(function(){

  if($(this).val() == 'delete'){
    if (!confirm("Delete all positions for this day?")){
      return false;
    }
  }

  if($(this).val() == 'publish'){
    if (!confirm("Publish all positions for this day?")){
      return false;
    }
  }

  if($(this).val() == 'draft'){
    if (!confirm("Save all positions for this day as a draft?")){
      return false;
    }
  }

});

…当我包含它时，确认警报会按预期显示，但如果输入字段为空，则不会再触发html5验证

它链接到的html（包装在表单标记中）

保存草稿
发表
删除日期

---

是什么导致了这种情况？谢谢

这是HTML5验证工作原理的一个非常简单的例子。它是开箱即用的。您只需在必填字段上设置

required

属性，并且仅当所有表单都有效提交时，才会提交表单。在下面的示例中，我使用jQuery，但验证需要普通javascript，因为我编写

$（this）[0]

，以获取DOM元素，而不是jQuery对象

//侦听按钮（其类型不是submit！）
$（'input[type=button]'）。在（'click'，函数（ev）上{
var action=$（this.val（）；
如果（确认（“您确定要执行“+操作+”？”）{
//强制提交，因为没有提交按钮
$（'#myForm'）。触发器（'submit'）；
}
//我们不需要一个else，也不返回false！我们只在确认后提交
});
//收听提交事件，这样当它是提交的表单时，我们就可以知道它了
$（'#myForm'）。关于（'submit'，函数（e）{
//checkValidity（）如果要发送表单，则返回true，否则返回false
警报（“将提交表单？”：“+$（此）[0].checkValidity（））；
});

名称：

电子邮件：

返回false
中断默认操作，即HTML5验证。改为使用
onsubmit
事件，并且您不需要
return false
如果使用HTML验证，如果未填写所需字段，则在没有javascript的情况下永远不会提交表单。谢谢。我最后把它放在一个jQuery提交函数中，我想这也是一个onsubmit事件。确认调用的目的不是确认缺少的字段，而是在成功验证后确认用户的操作。我希望这就是你的意思。如果用户改变主意，“return false”就会取消提交。哦，我还设法做到了
if（$（':focus'）.val（）=='delete'）{return confirm（“删除当天的所有位置？”）；}
更简洁。我可以制作一个简单的脚本，向您展示html5验证是如何工作的，以及如何用逻辑实现它。给我点时间，我现在正在工作，但我很快就能帮你。好的，谢谢。不过不要着急：）哇，这么彻底的回答。我真的很感激。谢谢
<button name="submit" type="submit" value="draft" class="btn btn-primary btn-lg acal-confirm" title="Do not make available publically">Save draft</button>
<button name="submit" type="submit" value="publish" style="margin-left:10px;" class="btn btn-primary btn-lg acal-confirm" title="Save and publish the positions publically">Publish</button>
<button name="submit" type="submit" value="delete" style="margin-left:10px;" class="btn btn-primary btn-lg acal-confirm" title="Delete the positions for this day">Delete day</button>