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);

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

1 个答案: