0

我正在尝试从选择框中获取元素 id，然后使用以下命令滚动到该元素：

// jump to services
$(function () {
    $("select.jump").change(function() {
        var selected = $(this).find("option:selected").val();
        console.log(selected);
        $('html, body').animate({
            scrollTop: $("#" + selected).offset().top
        }, 2000);
    });
});

console.log(selected)正确返回我的 ID，但我得到偏移量为空。

在我的 ID 选择器中，它似乎是一个括号和斜线问题。

4

1 回答 1

0

您提到您的 ID 中有括号和斜杠。

无论是方括号还是普通括号，括号在 jQuery 选择器中都有特殊的含义。包括斜线在内，您应该在 HTML ID 中完全避免使用它们。如果您参考 W3C 规范，这基本上是非法的 ID。

jQuery 选择器中的方括号是与属性相关的。

jQuery 选择器中的普通括号是与过滤器相关的。

请参阅 jQuery 选择器：http ://api.jquery.com/category/selectors/

最典型的选择器与CSS 选择器基本相同，并且应该遵循相同的命名约定：参见http://www.w3.org/TR/CSS21/syndata.html#value-def-identifier

这里我引用上面的 W3C 链接：

标识符（包括选择器中的元素名称、类和 ID）只能包含字符 [a-zA-Z0-9] 和 ISO 10646 字符 U+00A0 及更高，加上连字符 (-) 和下划线 (_)；它们不能以数字、两个连字符或一个连字符后跟一个数字开头。标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码（请参阅下一项）。例如，标识符“B&W？” 可以写成“B\&W\?” 或“B\26 W\3F”。

这是一个演示来说明这个问题：http: //jsfiddle.net/terryyounghk/tkx36/

虽然您的脚本本质上没有任何问题，但安全网会很好：

// jump to services
$(function () {
    $("select.jump").change(function() {
        var selected = $(this).find("option:selected").val(),
            $selected = $("#" + selected);

        if ($selected.length) {
            $('html, body').animate({
                scrollTop: $selected.offset().top
            }, 2000);
        } else {
            // handle this in case element is not found
        }
    });
});
于 2013-05-02T16:05:16.807 回答