0

JS try catch 不处理表单提交错误“名称为 somename 的无效表单控件不可聚焦。

我有一个共享一个提交的标签页。当页面加载时，当我从选项卡移动到选项卡时，隐藏的必填字段会导致验证错误。如果它触发了 try/catch，这将很容易解决，我可以查找消息并采取适当的行动，但是错误会直接跳过 catch 并且无法处理。 

                var isValidForm = form.checkValidity();
                if (!isValidForm) {
                    debugger;
                    let subbtn = document.getElementById('hiddenbtn');
                    let test = null;
                    try {
                        test = subbtn.click();
                    }
                    catch (ex) {
                        console.log(ex);
                        //if "An invalid form...not focusable" dont return but continue. we're ok with this error
                    }
                    test;
                    return;
                }

错误应该被 catch 捕获。它直接跳过它。谁能告诉我如何在代码中检测到这个错误，而不会出现与添加和删除几个必需属性相关的大麻烦。

4

2 回答 2

0

我为它创建了一个快速测试用例：（
单击测试按钮，错误仅出现在 chrome 的开发控制台中） 

function test() {
  let el = document.querySelector('button[type="submit"]');
  el.click();
  console.log("Still running");
}
.hidden_input { display: none; }
button[type="submit"] { margin-bottom: 0.5rem; }
<form>
  <input type="text" name="hidden_input" class="hidden_input" value="" required />
  <button type="submit">SUBMIT</button>
</form>
<button type="button" onclick="test()">TEST</button>

这个错误只发生在 Chrome 上，而不是 Firefox 上（至少从我的测试来看）。

我猜 Chrome 不会将错误传播为 javascript 错误，而只是将其记录下来。
（既window.onerror不能也try {} catch {}不能处理）

您的脚本也会在 之后继续执行subbtn.click()，所以这应该不是问题 :)

如果您仍然想摆脱错误，您可以禁用表单上的表单验证或直接提交表单而不是按提交按钮：

// Disable form validation:
form.noValidate = true;

// Or directly submit the form without using the button:
form.submit();
于 2019-07-23T21:27:22.163 回答
0

你在 try 块中有“test = subtn.click()”，但是你在块之外调用它。

尝试在 try 块中调用 click 函数，您将按预期捕获错误。

let test = subtn.click();
try {
    test;
} catch (ex) {
    console.log(ex);
    //if "An invalid form...not focusable" dont return but continue. we're ok with this error
}
return;
于 2019-07-23T20:59:17.720 回答