Question

如何在下拉列表中实现.scrollTo插件？当我从下拉列表中选择一个选项时，它会获取值并显示特定的div，但是在用户选择该选项后如何使该div立即向上滚动？我使用这个插件已经链接了一个href，这很容易，但我不知道如何用下拉列表实现它。这是html：

<select id="miasto">
    <option value="v1">opt1</option>
    <option value="v2">opt1</option>
    <option value="v3">opt1</option>
</select>

选择选项后显示Div：

<div id="v1" class="schowaj" style="display:none">div1 content</div>
<div id="v2" class="schowaj" style="display:none">div2 content</div>
<div id="v3" class="schowaj" style="display:none">div3 content</div>

jQuery的：

$(function(){
$('#miasto').change(function(){
    var divToShow = $('#'+$(this).val());
    $('.schowaj').not(divToShow).hide('slow');
    divToShow.show('slow');
}); 
});

Answer 1

将您的代码包装到select change event listener中：

$('select').change(function() {
    var divToShow = $('#'+$(this).val());
    $('.schowaj').not(divToShow).hide('slow');
    divToShow.show('slow');

    var offset = divToShow.offset().top;
    $('body').animate({
        scrollTop: offset
    }, 1500);
});

如何使用下拉列表实现.scrollTo插件

1 个答案: