Question

我希望在一个div中有一个产品项列表，点击后会加载＆＃34;加载更多＆＃34;。没有＆＃34;使用严格＆＃34 ;;它运作良好。但是当我使用＆＃34;使用严格的＆＃34 ;;它似乎不起作用。这就是我所拥有的：http://jsfiddle.net/mdmonir/ou4sjtan/

＆＃13;

$(document).ready(function () {
    size_li = $("#myList li").size();
    x=3;
    $('#myList li:lt('+x+')').show();
    $('#loadMore').click(function () {
        x= (x+5 <= size_li) ? x+5 : size_li;
        $('#myList li:lt('+x+')').show();
    });
    $('#showLess').click(function () {
        x=(x-5<0) ? 3 : x-5;
        $('#myList li').not(':lt('+x+')').hide();
    });
});

＆＃13;

#myList li{ display:none;
}
#loadMore {
    color:green;
    cursor:pointer;
}
#loadMore:hover {
    color:black;
}
#showLess {
    color:red;
    cursor:pointer;
}
#showLess:hover {
    color:black;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="myList">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
    <li>Six</li>
    <li>Seven</li>
    <li>Eight</li>
    <li>Nine</li>
    <li>Ten</li>
    <li>Eleven</li>
    <li>Twelve</li>
    <li>Thirteen</li>
    <li>Fourteen</li>
    <li>Fifteen</li>    
</ul>
<div id="loadMore">Load more</div>
<div id="showLess">Show less</div>

＆＃13;

Answer 1

问题是变量声明之前缺少var。添加它，你应该是金色的。在这种情况下，"use strict"指令阻止您无意中使用变量污染全局范围。因此，我们需要明确明确其预期范围：

var size_li = $("#myList li").size();
var x = 3;

在每个声明之前添加var，演示将继续工作。

加载更多项目js无效

1 个答案: