我正在使用 jquery 分页,但如果里面有其他标签,它就不起作用。
这是我的代码:
<head>
<link href="simplePagination.css" type="text/css" rel="stylesheet"/>
<script src="jquery-1.11.1.min.js"></script>
<script src="jquery.simplePagination.js"></script>
<script>
jQuery(function($) {
var items = $(".content");
var numItems = items.length;
var perPage = 1;
items.slice(perPage).hide();
$("#pagination").pagination({
items: numItems,
itemsOnPage: perPage,
cssStyle: "light-theme",
onPageClick: function(pageNumber) {
var showFrom = perPage * (pageNumber - 1);
var showTo = showFrom + perPage;
items.hide();
items.slice(showFrom, showTo).show();
}
});
});
</script>
</head>
<body>
<div id="pagination"></div>
<p class="content">
<table><tr>Window0</tr></table></p> //this code is working
if it doesn't have the table and
div tag inside, but in my original its mandatory for me to have this table tag and div tag
<p class="content"><div>Window1</div></p>
<p class="content">Window2</p>
<p class="content">Window3</p>
<p class="content">Window4</p>
</body>
所有分页插件都可以在这里使用。 https://github.com/flaviusmatis/simplePagination.js
请参阅我在代码中给出的注释行,有问题。帮我解决这个问题。
最佳答案
您需要修复您的标记。 p
标签并不意味着像您所做的那样包含其他 block 级元素, but only "phrasing" elements 。使用 div
作为您的 .content
元素,然后在其中适当嵌套,一切正常。 ( DEMO )
<div id="pagination"></div>
<div class="content"><table><tr><td>Window0</td></tr></table></div>
<div class="content"><div>Window1</div></div>
<div class="content">Window2</div>
<div class="content">Window3</div>
<div class="content">Window4</div>
此外,在未来,指定您实际看到的行为会很有帮助,而不是“不工作”——这无助于任何人进行故障排除。
关于javascript - 如果内部有其他标签,带有 <p> 标签的 jQuery 分页会在单个页面中显示所有页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28195046/