Question

我已成功检查了输入是否有效（在我的情况下为空[请忽略susbtring()，由于特殊要求，我必须使用它）] 。但是，我想手动在您未在Input field is not valid中输入任何内容并提交表单时触发默认弹出窗口，提示<input>。

我要执行上述操作，因为我要检查有效或无效的目标输入位于隐藏的“标签”中。如果可能的话，我不需要解决方法。可以手动触发该弹出窗口吗？

我使用以下命令检查了目标输入是否有效

trackedInput = $('#trackedInput');
confirmSubmit = $('#confirmSubmit');

confirmSubmit.click(function(e) {
    if (!trackedInput.val().substring(4)) {
        tabs.eq(0).trigger('click'); //tabs.eq(0) here selects the first div and 'click' it, causing it to be not_hidden and causing the current 'not_hidden' div to be hidden
        return false;
    }
}

<div class = "hidden">
  <input id = "trackedInput" type = "text" form = "confirm">
</div>

<div class = "hidden">
  //Some other stuffs here
</div>

<div class = "not_hidden">
  <input id = "confirmSubmit" type = "submit" form = "confirm">
</div>

<form id = "confirm"></form>

编辑：

默认情况下，我的意思是：the 'Please fill out this field' popup。

Answer 1

您可以使用form.reportValidity()。它基本上检查表单并验证它，如果检测到无效字段，它将触发该弹出消息。

trackedInput = $('#trackedInput');
confirmSubmit = $('#confirmSubmit');
yourForm = document.querySelector('#confirm');

confirmSubmit.click(function(e) {
  if (!trackedInput.val().substring(4)) {
    yourForm.reportValidity();
    return false;
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="hidden">
  <input id="trackedInput" type="text" form="confirm" required>
</div>

<div class="hidden">
  //Some other stuffs here
</div>

<div class="not_hidden">
  <input id="confirmSubmit" type="submit" form="confirm" required>
</div>

<form id="confirm"></form>

使用jQuery触发无效输入的弹出窗口

1 个答案: