javascript - Wrapall 适用于数字但不适用于变量

Question

考虑这段代码:

<script>
var n = 5; // NOTICE THIS LINE!!
$(function() {
var $newDiv = $("#content > .post:gt(5)").wrapAll($("<div>").addClass("hidden"));
$("<div>", { class: "onclick" }).insertBefore($newDiv.parent()).html("Load More");
$(".onclick").click(function() {
n = n+n+5; // NOTICE THIS LINE !!
$(this).remove();
$(".hidden .post").unwrap();
$newDiv = $("#content > .post:gt(n)").wrapAll($("<div>").addClass("hidden")); // NOTICE!!
$("<div>", { class: "onclick" }).insertBefore($newDiv.parent()).html("Load More");
});
});
</script>

还有我的 HTML:

<div id="content">
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>

<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
</div>
<div class="onclick">CLICK ME!</div>

这非常有效 IF 我从“wrapAll”中删除“n”并输入数字 6 或 10。为什么？

请帮忙!

Answer 1

是因为代码

$newDiv = $("#content > .post:gt(n)").wrapAll($("<div>").addClass("hidden"));

假定只是一个字符串“.post:gt(n)”。它不知道这是一个数字。将此行更改为:

$newDiv = $("#content > .post:gt(" + n + ")").wrapAll($("<div>").addClass("hidden"));