Question

我必须滚动到特定的div onform submit（如果有任何错误）。但它会显示窗口的顶部而不显示错误消息。这是我的代码：

HTML

<form name="createProperty" method="POST" onsubmit = "return submit_new_property()">
    <select class="slt_box" name="property_type" id="property_type">
        <option>Select</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select>
</form>

JS

function submit_new_property() {
    var property_type = $('#property_type').val();

    if(property_type == 'Select' || property_type == '' || property_type == null) {
        document.getElementById("basic_info_error_div").innerHTML="Choose Property Type";
        document.getElementById("basic_info_error_div").style.display='block';
        $.scrollTo( $('#basic_info_error_div'), 500);
        return false;
    }
    else {
        document.getElementById("basic_info_error_div").innerHTML = "";
        document.getElementById("basic_info_error_div").style.display = 'none';
    }
}

Answer 1

您可以使用.scrollTop()

$('html, body').animate({
    'scrollTop' : $('#basic_info_error_div').position().top
}, 500);

OR

如果您想要vanilla JS，可以使用Element.scrollIntoView

document.getElementById('basic_info_error_div').scrollIntoView(true);

Answer 2

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

Answer 3

您似乎正在尝试使用jquery.scrollTo插件。您需要从releases page下载。

之后你可以这样做：

$.scrollTo('#basic_info_error_div', 500);

它将按预期工作。

干杯

滚动到jquery中的特定div？

3 个答案: