Question

我已经搜索过并且无法使任何解决方案正常工作。（而且我不是100％明白为什么？）

我正在动态构建一个下拉列表（选择）框...

将匹配的锚标记名称（编号）添加到选择框中每个选项的值。

我有一些jQuery可以监视选择框中的任何更改并“跳转”到行进锚标记/名称...

但它没有用。

根据我尝试的方法，我会收到这些错误：

TypeError: $(...).offset(...) is undefined      

$("html, body").animate({scrollTop: $('#' + $(this).val()).offset().top}, "slow"...

或：

Error: Syntax error, unrecognized expression: ##15

当我在jQuery语句中有＃而没有：

问题1：我应该在选项条目值中加上＃吗？或者将它保留在jQuery语句中？

jQuery的：

$('#topic_entries').change(function(){                                  
            //populate fields with video details            
            if($('#topic_entries option:selected').text() == 'No Videos Found'){
                //do nothing (dead)     
            }else{
                var targetAnchor = $(this).val();
                console.log(targetAnchor);              
                //$('html,body').animate({scrollTop: targetAnchor}, 'slow');
                //$('html, body').animate({'scrollTop': $(targetAnchor).top}, 2000);        
                //$('html, body').animate({scrollTop: $(targetAnchor).offset().top}, 1000);
                $('html, body').animate({scrollTop: $('#' + $(this).val()).offset().top}, "slow");

            }
        });

我在这里缺少什么？我只想在下拉选择（值）

中执行一个简单的“跳转到锚点”功能

缺少HTML部分：

for($i=0; $i<count($results); $i++){
    //update currentTopic
    $currentTopic = $results[$i]['topic'];
    echo '<option value="'.$i.'">' . $currentTopic . '</option>';
    //echo '<option value="#'.$i.'">' . $currentTopic . '</option>';
}

============================================== < / p>

解决方案更新：

好吧，似乎一个快速而简单的解决方法就是使用这一行：

window.location.hash = targetAnchor;

但我很好奇为什么没有一个jQuery尝试对我有用？（即：我正确地做了什么？）

Answer 1

您需要使用id属性（例如

）渲染锚点

<a id="foo"></a>

同时确保jQuery选择$(this).val()中的$('#' + $(this).val())仅返回id属性的值，以使jQuery选择器正确，例如#foo，如上面的锚点所示。

jQuery：从下拉列表（选择）框跳转到锚标记？

1 个答案: