想高亮分页link onclick。这是我的代码

Question

我想在点击时突出显示分页 link。请帮助我

CSS 分页样式模板

#tnt_pagination {
    display:block;
    text-align:left;
    height:22px;
    line-height:21px;
    clear:both;
    padding-top:3px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
    font-weight:normal;
}

#tnt_pagination a:link, #tnt_pagination a:visited{
    padding:7px;
    padding-top:2px;
    padding-bottom:2px;
    border:1px solid #EBEBEB;
    margin-left:10px;
    text-decoration:none;
    background-color:#F5F5F5;
    color:#0072bc;
    width:22px;
    font-weight:normal;
}

#tnt_pagination a:hover {
    background-color:#DDEEFF;
    border:1px solid #BBDDFF;
    color:#0072BC;  
}

#tnt_pagination .active_tnt_link {
    padding:7px;
    padding-top:2px;
    padding-bottom:2px;
    border:1px solid #BBDDFF;
    margin-left:10px;
    text-decoration:none;
    background-color:#DDEEFF;
    color:#0072BC;
    cursor:default;
}

#tnt_pagination .disabled_tnt_pagination {
    padding:7px;
    padding-top:2px;
    padding-bottom:2px;
    border:1px solid #EBEBEB;
    margin-left:10px;
    text-decoration:none;
    background-color:#F5F5F5;
    color:#D7D7D7;
    cursor:default;
}

#tnt_pagination a.highlite {
            font-weight:bold;
        }

</style>

</head>

<body>

<div id="tnt_pagination">
    <span class="disabled_tnt_pagination">Prev</span>

        <a id="default" class="highlite" onclick="highlite(this);"  href="#1">1</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#2">2</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#3">3</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#4">4</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#5">5</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#6">6</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#7">7</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#8">8</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#9">9</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#10">10</a>
        <a id="default" class="highlite" onclick="highlite(this);" href="#forwaed">Next</a>

</div>

</body>
</html>

我想在点击时突出显示分页 link。

这是一个简单的分页示例，其中我使用了 1 到 10 link 并且我还使用 css 禁用了上一个 link。但我的问题是每个 link 在加载页面上都是 highlite 但我只想在点击分页 link

时激活 link

请帮帮我

Answer 1

试试只响应点击的 :active 选择器，例如在你的 CSS:

#tnt_pagination a.highlite:active{
    background-color: yellow;
    font-weight:bold;
}

这是 JSFiddle 上的演示：https://jsfiddle.net/15ydkjdg/

想高亮分页link onclick。这是我的代码

Want to highlite pagination link on click. here is my code

html

javascript

css

pagination