jquery - jquery-发生错误时窗口滚动到特定位置

Question

我有一个包含许多输入字段的表单，当我在表单之前提交验证错误时发生在顶部。我的问题是当错误消息验证错误发生时如何使窗口滚动到div#msg页面底部的光标位置？

<div id="msg"><ol></ol></div>
<form id="myform">
    <input type="text" name="field1"/>
    <input type="text" name="field2"/>
    <input type="text" name="field3"/>
    ...
    <input type="text" name="fieldn"/>
    <input type="submit" value="submit"/>
</form>

<script type="text/javascript"> 
$().ready(function() {

var options = { 
    success:       showResponse
    }; 

var container = $('#msg');
var validator = $("#myform").validate({
    messages: {
        field1: {
            required: "message",
        },
        fieldn: {
            required: "message",
        },
    },
    errorContainer: container,
    errorLabelContainer: $("ol", container),
    submitHandler: function(form) {
            jQuery(form).ajaxSubmit(options);
    },
    wrapper: 'li',
    meta: "validate",   
});

function showResponse(responseText, statusText, xhr, $form)  { 
          alert(responseText);
          validator.resetForm();
} 
});
</script>

Answer 1

showResponse如果它返回您的验证错误，您需要在回调函数中插入一个 jQuery animate 函数调用。

尝试：

$("html,body").animate({scrollTop:$('div#msg').offset().top}, 500);