Javascript onclick函数停止HTML5的工作

你好

我正在处理一个表单，其中我的所有文本字段都有一个必需的属性；我注意到，当我单击SubmitRequired属性时，并没有显示一个弹出窗口来验证字段是否为空

我的页面上有两个提交按钮，都使用onclick submitform函数；一个打开一个新选项卡，另一个提交表单并转到一个新页面

出于调试目的，我删除了打开新选项卡的按钮，并删除了第二个按钮上的onclick属性，它就工作了；我在谷歌上搜索了一整天，但似乎找不到与目前相同的情景

我相信这与我的JS有关，但我不确定在我的代码中添加或删除什么；请看下面我的代码

JavaScript

 function submitForm(action,newtab)
 {
    document.getElementById('add2').target = newtab ? '_blank' : '_self';
    document.getElementById('add2').action = action;
    document.getElementById('add2').submit();
 }

HTML

儿童信息
保存详细信息

我有一个button属性，但我已经将其设置为type=“submit”，我非常确定它可以正常工作，因为我在删除onclick函数时已经对它进行了测试；我的问题是，我可以在不删除JavaScript的onclick函数的情况下使用required属性吗

---

非常感谢您的帮助。

您可以在提交之前检查值，而不是使用所需的

function submitForm(action,newtab) {
    fname = document.getElementById('fname').value;
    lname = document.getElementById('lname').value;
    if (fname == "" || lname == "") {
        alert("First and last name are required");
        exit;
    } else {
        document.getElementById('add2').target = newtab ? '_blank' : '_self';
        document.getElementById('add2').action = action;
        document.getElementById('add2').submit();
    }
 }

---

我找到了问题的答案，问题是我将onClick方法绑定到submit。onClick将首先触发，这将导致它通过验证器

解决方案是在HTML代码中将onClick改为onSubmit

<button tabindex="3" value="Save"
name="save" onsubmit="submitForm('add3.php',1);" 
type="submit">Child Information</button>
<button tabindex="4" value="Save"
name="save" onsubmit="submitForm('add5.php',0);" 
type="submit">Save Details</button>

子信息
保存详细信息

在提交onclick函数之前，只需在表单上使用“checkValidity（）”方法，如下所示：

if($("#add2").checkValidity()) { 
 document.getElementById('add2').submit();
}

---

查看此提琴：

编辑问题，因为HTML代码未显示请提供您认为应该有效但不正确的示例代码，除非此处输入错误，否则您缺少一个引号：

name=“save onclick=“

很难显示HTML；是的，“保存在哪里”输入法可以让代码正常工作，但当需要时添加到文本字段中，它就不起作用了；我发现这是一个一次性停止需要从工作；当我删除子信息表并将字段留空并单击“保存所需详细信息”字段时，该字段立即生效；所以我想弄明白为什么onclick停止需要工作；非常感谢您的见解。感谢您的回答，我在发布我的问题作为解决方法之前已经考虑过了，但是我的页面上有两个以上的字段，我的问题上只有两个字段作为示例，因为如果我发布了所有的荣誉，我发现读者很难阅读！比我的答案要好得多。最好使用

表单的
onsubmit
属性，而不是
按钮的
onsubmit
属性，因为在JS中，可以通过调用
事件.preventDefault（）
来阻止提交操作。
if($("#add2").checkValidity()) { 
 document.getElementById('add2').submit();
}