gpt4 book ai didi

javascript - 带有更多按钮的 jquery 移动页面

转载 作者:行者123 更新时间:2023-11-30 13:13:03 24 4
gpt4 key购买 nike

我正在设置一个显示超过 50 个元素的 j 查询移动页面,关于如何在打开页面时仅显示前 10 个元素的任何建议,以及底部的更多按钮,如果单击它可以显示所有元素。我的脚本是:

<body> 

<div data-role="page" data-add-back-btn="true" data-back-btn-text="Back" >
<div data-role="header" >
<h1 style="white-space:normal">body</h1>

</div>
<ul data-role="listview" data-inset="true" data-filter="false">
<li><a href="http://www.mydomain.co.nz/users/262/">Feature listings</a> </li>

<ul data-role="listview" data-filter="false">

<table>

<li>
<a href="/users/264/properties/50473">
<img src="/media/2012/11/01/011528_47689.jpg?m=resize&o[geometry]=80x60&s=f9e49fbb929e8d1b" />
<h3>7C/192 Willis Street</font></font></font>, Beijing</h3>
<p>Buyer Enquiry Over $305,000<br />Ref: 47689</p></a>
</li>

<li>
<a href="/users/264/properties/50474">
<img src="/media/2012/11/01/011533_47722.jpg?m=resize&o[geometry]=80x60&s=b4482c7638c512b4" />
<h3>606/35 Abel Smith Street</font></font></font>, Te Aro</h3>
<p>Tender<br />Ref: 47722</p></a>
</li>

<li>
<a href="/users/264/listings/50476">
<img src="/media/2012/11/01/011539_47691.jpg?m=resize&o[geometry]=80x60&s=66def46f1524e177" />
<h3>8/34 William Street</font></font></font>, Hataitai</h3>
<p>Buyer Enquiry Over $280,000<br />Ref: 47691</p></a>
</li> ........
....... over 50 elements

最佳答案

您可以尝试对 li 元素使用 slice 并隐藏它们。

首先,用 CSS 隐藏所有:

li { display: none; }

然后在 JavaScript 中显示前 10 个,并设置点击事件监听器以显示隐藏的:

$('li').slice(0,10).css('display', 'block');
$('#more-button').click(function() {
$('li:hidden').show();
});

关于javascript - 带有更多按钮的 jquery 移动页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13185549/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com