我对javascript比较陌生,所以任何帮助都会很好……提前谢谢。下面的方法是有效的,但当我单击一个选项时,它变成紫色,页面刷新,然后紫色消失。有什么想法吗?我希望选择的选项在页面刷新时保持紫色。也就是说,告诉我我在哪一页上。
这就是我所拥有的:
<div>
<table class="news-pages">
<tr class="news-pages">
<td class="news-pages-option"><a href=<%- `/news?p=1` %>>1</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=2` %>>2</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=3` %>>3</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=4` %>>4</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=5` %>>5</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=6` %>>6</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=7` %>>7</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=8` %>>8</a></td>
<td class="news-pages-option"><a href=<%- `/news?p=9` %>>9</a></td>
</tr>
</table>
</div>
<script>
$(document).ready(function() {
$(".news-pages-option").click(function () {
$(".news-pages-option").removeClass("active");
$(this).addClass("active");
});
});
</script>
.news-pages-option.active {
background-color: purple;
}
发布于 2018-06-30 05:25:49
所有的类都会在页面加载时被移除并重置。当您传递查询参数时,您可以在页面加载时读取它们,并相应地设置类。
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
const page = getParameterByName('p');
$('td.news-pages-option a[href*="p=' + page + '"]').parent().addClass('active');
getParameterByName函数取自How can I get query string values in JavaScript?
https://stackoverflow.com/questions/51109505
复制相似问题