javascript - 使数据属性表现得像 anchor

Question

是否有可行的方法使数据属性的行为像 anchor 一样？

考虑以下可能的情况:

<a id="link" href="#home">

<div data-section="home">

是否有可能以某种方式将 anchor 标记绑定(bind)到具有相同命名数据属性的那个 div？

这行不通，但有点像:

$("#link").click(function(e) {
    var clickedLetter = $(this).attr('href');
    $(this).attr("href", "#section[data-group='" + clickedLetter + "']")
});

Answer 1

kawnah，在我看来你需要获得点击元素的href

var clicked = $(this).attr('href');

之后，您可以使用替换函数并获得没有标签符号(#)的href

var myAttr = replace('#', clicked);

最后一个你应该做的是动画主体到元素有这个数据部分

var elementScrolledTo = $('*[data-section="' + myAttr + '"]');

$('html, body').animate({
                scrollTop: elementScrolledTo.offset().top
            }, 2000);

当然，这是jquery on event的处理函数。 http://api.jquery.com/on/