Javascript PureCSS在表单提交时停止页面重新加载，但保留表单验证

我试图在我的web应用程序中使用PureCSS表单，但我不知道如何在停止页面重新加载时保留漂亮的表单验证

我知道我可以使用

onsubmit=“return false；”“

然后我可以使用AJAX发布表单数据，使用

onClick=“PostSettings（）；”

，其中PostSettings（）是包含AJAX请求的javascript函数。我还必须包括

event.preventDefault（）位于该函数顶部，以停止重新加载

不幸的是，这些停止重新加载的步骤也停止了内置的PureCSS验证

有没有一种方法可以在不触发页面重新加载的情况下保留它，或者我需要在javascript中进行自己的验证

仅供参考，以下是html：

<button type="submit" class="pure-button pure-input-1-2 pure-button-primary"
  id="save-simulation-button" onClick="PostSettings();" 
  onsubmit="return false;">
    <i     class="fa fa-save"></i> Submit Simulation Parameters
</button>


提交模拟参数
在“PostSettings（）”方法中使用“return false”而不是event.preventDefault（）。
感谢您的回复Lucas和Vignesh——他们没有完全解决问题，但他们让我思考，我开发了一个解决方案：

在html中，我必须在这里添加一个return:
onClick=“return PostSettings（）；”

然后在javascript中，根据表单是否通过验证，返回
true
或
false
，我必须检查：

function PostSettings() {
    //event.preventDefault(); <<- commented out per Vigneshs suggestion

    var name = $("#simulation-name").val(); // jquery to get form values
    var description = $("#description").val();

    // Code to validate form: name and description cannot be blank
    if (name === "" || description === "") {
        console.log("name or description fields cannot be blank");
        return true; // <<- returning true allows PureCSS validation to continue
    }

    // Code passed validation so post the data...
    // POST code omitted for brevity

    return false; // <<- returning false stops the page reload
}

function PostSettings（）{
//event.preventDefault（）；您只需要表单标记中的onsubmit=“return MyValidFunction（）；”，而“提交”按钮中不需要任何其他内容

当表单不正常时，PureCSS使用他的消息进行验证，当一切正常时，调用“MyValidFunction（）”函数

函数MyFunction（）{
///这里是您的Ajax代码
返回false；
}
好啊
我也有同样的问题。在表单标记中添加
onsubmit=“event.stopPropagation（）”
可以防止表单有效时刷新，并在表单无效时保留验证标志。
删除onclick并使用onsubmit=“PostSettings（）；”怎么样？
function MyFunction() {
   /// your Ajax Code here
   return false;
}

<form class="pure-form" onsubmit="return PostSettings();">
  <input id="form_url" type="url" class="pure-input-1-3">
   <button type="submit" class="pure-button pure-input-1-1">OK</button>
</form>