Question

当您更改select元素中的选项时，我会进行锚点滚动。但是，这只能在值属性中插入一个id。可以使用href吗？我会将值atribute用于其他事情。谢谢，圣诞快乐!!

<!-- THIS WORK -->

<select>
   <option value="#b1">1 test</option>
   <option value="#b2">2 test</option>
   <option value="#b3">3 test</option>
 </select>

 <!-- THIS DON`T WORK =/ -->

 <select>
     <option href="#b1">1 test</option>
     <option href="#b2">2 test</option>
     <option href="#b3">3 test</option>
 </select>

Answer 1

对于课堂可以这样做：

  $('select').on('change', function () {
      var $el = $($(this).find(':selected').attr('class'));
      $('html,body').animate({
          scrollTop: $el.offset().top
      }, 500);

  })

的 DEMO

Answer 2

你的小提琴

 // fluid scroll in the select>option change

      $('select').on('change', function () {


           $('html,body').animate({
                      scrollTop: $(this.value).offset().top
                  }, 500);
      });
  });

此处为您提供$(this.value)的scrollTop，因此仅当您提供value = "#b1"

时才有效

将其更改为$(this.options[this.selectedIndex].id)，它将适用于id="#b1"

Answer 3

此处更新了小提琴：http://jsfiddle.net/E3MBb/5/

使用类，即使我觉得以这种方式使用类也很奇怪。正确的方法是在我的脑海中使用价值，但在这里你去：）

很容易编辑小提琴以获取所选的选项ID，href或除了值之外你想要的其他任何属性，最好像以前一样使用this.value。

如何使用选择＆gt;制作锚点使用类的选项元素

3 个答案: