Question

我在这里创建了一个样本来帮助我理解， http://www.jsfiddle.net/BLvsF/

我希望将项目''a6'滚动到可见的选择框中，我该怎么做？我想使用jquery做同样的事情

$(document).ready(function() {
    $('#btn').click(function() {
        document.getElementById('a6').scrollIntoView();
        });
});

但是，如何使用jQuery实现相同的功能？

我尝试使用.get（0）.scrollIntoView（）。但仍不适用。

$(document).ready(function() {
    $('#btn').click(function() {
        $('#a> option:selected').clone(false).appendTo('#b').get(0).scrollIntoView();
    });
});

http://www.jsfiddle.net/CYQfD/

谢谢，伊莱恩

Answer 1

这很好......

$(document).ready(function() {
    $('#btn').click(function() {
        //document.getElementById('a6').scrollIntoView();
        var target = $("#b");
        $('#a> option:selected').clone(false).appendTo(target);
        target.get(0).selectedIndex = target.get(0).options.length - 1;

    });
});

Answer 2

我的答案不过是将How to scroll a select list with JavaScript or jQuery?的解决方案应用于你的jsfiddle：

http://jsfiddle.net/BLvsF/58/

$(document).ready(function() {
   $('#btn').click(function() {
     var $s = $('#a');
     var optionTop = $s.find('[value="a6"]').offset().top;
     var selectTop = $s.offset().top;
     $s.scrollTop($s.scrollTop() + (optionTop - selectTop));
   });
});

Answer 3

只需用这行代码替换按钮处理程序，就完成了。

$('#a').val('a6').scrollIntoView();

Answer 4

你无法使用native选项元素，因为它不是像div这样的元素。您必须在select上创建一个标记，其作用类似于下拉列表，但是可以扩展。我现在正在移动，所以我不能告诉你一些例子。但是有一些jquery插件可以让你制作叠加层，你可以更轻松地控制

搜索jquery下拉列表或其他内容并选择一个看起来很容易使用的内容。

jquery，如何将选定的选项滚动到可见视图？

4 个答案: