是否展示》显示更多》按钮

前言:

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<title>Document</title>
	<script src="jquery.min.js"></script>
</head>
<body>
	<div class="p">
    <ul>
        <li>111111111</li>
    </ul>
    <a href="" class="btn">show more</a>
</div>
<div class="p">
    <ul>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
        <li>111111111</li>
    </ul>
    <a href="" class="btn">show more</a>
</div>
<script>
    $('ul').each(function () {
        if ($('li:gt(4)', this).hide().length == 0) $(this).next().hide();
        else $(this).next().click(function () { $(this).prev().find('li:gt(4)').show();  return false})
    })
</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/dongsdh/article/details/80997870
今日推荐