Question

当内部链接的div变得聚焦时，有没有办法对其进行样式化？就像说我在页面顶部有一个链接，我在内部链接（<a href="samepage.html#more">）到页面下方的div（<div id="more">），当有人点击该div时，是否有任何链接如何设计它以显示它的焦点（就像我可能会使用其背景颜色的变化或在点击时给它一个边框）？它不是真的像给它一个悬停样式，它更多地赋予它在活动或焦点或类似的东西上的样式。有没有办法做到这一点？

我不确定是否没有办法做到这一点，或者我是否正在密集且有一种简单的方法，但到目前为止我还没有看到它。感谢。

Answer 1

您应该将JavaScript函数绑定到window.onhashchange事件：

window.onhashchange = function () {

    var hashloc = window.location.hash;

    // hashloc is a string like '#focusDiv'
    // .. manipulate DOM

};

这个微型工作jsFiddle示例使用jQuery，并在发生哈希更改事件时向焦点DIV添加一个CSS类。

事件是使用普通JS绑定的，因为jQuery本身并不提供这个钩子，如Matt所指出的那样，旧的浏览器根本不支持它。为了解决这个问题，我强烈建议this jQuery plugin用于简单的哈希事件。

Answer 2

Divs没有我所知道的焦点属性，但您可能希望在URL中的散列更改时绑定到事件，然后将更改应用于具有值的ID的div哈希。

例如，绑定到此事件：window.onhashchange - 它只适用于现代浏览器（ie8 +，Chrome 5 +，Firefox 3.6+等）而无需进行一些调整。

当它变得集中时，将内部链接的div设置为样式

2 个答案: