3

I'm using JQuery Multiselect plugin from here: http://www.erichynds.com/blog/jquery-ui-multiselect-widget

When the list of options is long a scroll appears, but it doesn't scroll automatically to the selected option. It means that, after selecting the 50th option, if I want to select option 51st I have to search again all the way down.

Do you know how to solve this issue? I tried to use scrolltTop but no luck.

The code is really simple...

$(function(){
   $("select").multiselect({multiple: false, selectedList: 1});
});

Here is a jsfiddle with this problem: http://jsfiddle.net/g5r92/1/

Thanks a lot in advance.

4

3 回答 3

2

看看这个，第一次尝试，它工作正常

http://jsfiddle.net/g5r92/7/

 $(function(){
   $("select").multiselect({multiple: false, selectedList: 1});
   $('.ui-multiselect').click(function(){

      $('.ui-multiselect-checkboxes').animate({
         scrollTop: $(".ui-multiselect-checkboxes .ui-state-active").offset().top
      }, 2000);
   });    

  });

您只需要根据自己的需要调整它，在偏移量中添加一些额外的像素，它将在中间而不是最顶部滚动选定的选项

于 2013-06-12T15:51:34.917 回答
0

你是对的，它确实有效。我的问题是因为我在同一页面中有多个多选，所以 offset().top 对于除第一个多选之外的任何多选始终为零（而且我没有注意到第一个多选不为零...... ）。解决了这个问题：

$('.ui-multiselect-checkboxes').scrollTop($($('.ui-multiselect-checkboxes .ui-state-active')[index]).offset().top);

其中 index 是页面中多选的索引。

非常感谢！

于 2013-06-14T07:47:09.157 回答
0

我建议，在打开菜单选项时编辑您的“jQuery MultiSelect UI Widget 1.12 ”JS 文件以“自动选择”。

在您的文件中，搜索：（始终选择第一项） this.labels.eq(0).trigger('mouseover').trigger('mouseenter').find('input').trigger('focus');

并将其更改为：（动态选择）：

var idxSelected = 0; if (o.multiple == true){ // find first checked. idxSelected = $container.find('input[type=checkbox]:checked:first').parent().parent().index(); }
else { // find the one that checked idxSelected = $container.find('.ui-state-active:first').parent().index(); } idxSelected = idxSelected < 0 ? 0 : idxSelected ; this.labels.eq(idxSelected).trigger('mouseover').trigger('mouseenter').find('input').trigger('focus');

在 FF + CHROME + IE 上测试（在多个 + 单个列表上）

于 2015-06-03T07:13:30.190 回答