我的表单存在问题 - 该表单会在不重新加载页面的情况下进行验证，并且仅在我单击发送按钮后才在屏幕上打印错误。
出现此问题的原因是错误消息仅出现在表单顶部。
然后，如果您使用小型设备和小屏幕 - 顶部和发送按钮不会出现在同一屏幕中。
如果表单有错误 - 并且您单击“发送” - 您将看不到该消息，并且表单不会发送到任何地方。
为了纠正这个问题，我需要在单击提交按钮后再次将屏幕保留在表单顶部
我尝试在顶部放置一个 anchor id，并创建一个
<a href="#topform"><button type="submit"></a>
或
<button type="submit" onclick="document.href:#topform">
但这不起作用。有什么想法吗？
最佳答案
检查这个示例，您可以将其放在表单 id 元素的顶部。
function toTop() {
$('html, body').animate({scrollTop: $( $('body') ).offset().top}, 500, 'swing');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<html>
<body>
<form id="contactForm" class="form-horizontal">
<div class="form-group">
<label class="col-xs-3 control-label">Full name</label>
<div class="col-xs-4">
<input type="text" class="form-control" name="firstName" placeholder="First name" />
</div>
<div class="col-xs-4">
<input type="text" class="form-control" name="lastName" placeholder="Last name" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Phone number</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="phoneNumber" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Email address</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="email" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Message</label>
<div class="col-xs-9">
<textarea class="form-control" name="message" rows="7"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label" id="captchaOperation"></label>
<div class="col-xs-3">
<input type="text" class="form-control" name="captcha" />
</div>
</div>
<div class="form-group">
<div class="col-xs-9 col-xs-offset-3">
<button type="submit" class="btn btn-primary" onclick='toTop()'>Submit</button>
</div>
</div>
</form>
</body>
</html>创建一个滚动到顶部的函数，然后从 html 按钮元素调用 我不知道您是否在主页或何处有表单，因此您必须检查该元素，但这就是想法:
JavaScript
function toTop() {
$('html, body').animate({scrollTop: $( $('body') ).offset().top}, 500, 'swing');
}
html
<button onclick="toTop()">Click me</button>
干杯!!!
关于javascript - JQuery - 如何发送表单并调用 anchor ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38814683/