如何找出 next() 何时到达末尾,然后转到第一项

2024-01-19

我使用 next() 函数显示一系列元素。不过,一旦到达终点,我想转到第一个元素。有任何想法吗?

这是代码:

//Prev / Next Click
$('.nextSingle').click( function() {
    //Get the height of the next element
    var thisHeight = $(this).parent().parent().parent().next('.newsSingle').attr('rel');
    //Hide the current element
    $(this).parent().parent().parent()
        .animate({
            paddingBottom:'0px',
            top:'48px',
            height: '491px'
        }, 300) 
        //Get the next element and slide it in      
        .next('.newsSingle')
        .animate({
            top:'539px',
            height: thisHeight,
            paddingBottom:'100px'
        }, 300);
});

基本上我需要一个“if”语句,表示“如果没有剩余的‘下一个’元素,则找到第一个元素。

Thanks!


确定.next()通过提前检查其length财产。

$('.nextSingle').click( function() {
       // Cache the ancestor
    var $ancestor = $(this).parent().parent().parent();
       // Get the next .newsSingle
    var $next = $ancestor.next('.newsSingle');
       // If there wasn't a next one, go back to the first.
    if( $next.length == 0 ) {
        $next = $ancestor.prevAll('.newsSingle').last();;
    }

    //Get the height of the next element
    var thisHeight = $next.attr('rel');

    //Hide the current element
    $ancestor.animate({
            paddingBottom:'0px',
            top:'48px',
            height: '491px'
        }, 300);

        //Get the next element and slide it in      
    $next.animate({
            top:'539px',
            height: thisHeight,
            paddingBottom:'100px'
        }, 300);
});

顺便说一下,你可以替换.parent().parent().parent() with .closest('.newsSingle')(如果您的标记允许)。

EDIT:我更正了thisHeight使用$next我们引用的元素。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何找出 next() 何时到达末尾,然后转到第一项 的相关文章

  • 更改时触发跨度文本/html

    jQuery 或 JavaScript 中是否有任何事件在以下情况下触发span标签 text html 已更改 Code span class user location span user location change functio
  • 如何创建增量加载网页

    我正在编写一个处理大量数据的页面 它会永远持续到我的结果页面加载 几乎无限 因为返回的数据太大了 因此 我需要实现一个增量加载页面 例如 url 中的页面 http docs python org http docs python org
  • 通过 jQuery 从输入类型=“文件”多个中删除文件

    我在使用 PHP 和 jQuery 上传文件时遇到问题 表单可以一次上传多个图像 这些图像可以在滑块中预览 表单还包含两个字段标题和描述 滑块通过 jQuery 工作 当用户通过单击选择文件来选择多个图像时
  • jQuery:如何在显示元素的同时使用高亮效果?

    我在一个页面上有两个元素 div content div div style display none different content div 当我点击当前显示的div 我想隐藏它并显示另一个 这很容易做到 a hide b show
  • HTML 和 JavaScript - 将滚动操作从一个元素传递到另一个元素

    假设我有两个 div div div div A scrollable list div 我想让它当光标停在里面时 control并且鼠标滚轮滚动 view将会滚动 无论如何要实现这一目标 好的 快速修复对我有用 即使固定 div 不可滚动
  • jquery:选择xpath或将xpath转换为css?

    我需要基于 xpath 选择 或者将 xpath 转换为 css 有插件或者内置功能吗 ex html body div a 4 each 并非所有 xpath 表达式都可以转换为类似 CSS 的选择器 或者不能有效地工作 您可以使用 eq
  • 两个 OnClick 事件重叠

    我在元素内有一个元素 当我单击下面的元素时 我希望打开滑块 当我单击最外面的元素时 我希望滑块关闭 不幸的是 当我单击最外面的元素时 它也会单击下面的元素 有没有办法只单击最外面的元素而忽略下面元素的单击 这些事件在单击时触发并使用 Jav
  • jquery验证-等待远程检查完成

    当我打电话时 form valid 我连接了远程验证检查 一切正常 但是如果所有其他字段都有效 则表单会通过验证 因为远程检查没有 足够快 返回响应 有没有办法强制 jquery 验证等待任何远程检查完成或挂钩远程检查调用的完成事件 我目前
  • 了解设置 JQuery 变量

    了解设置 JQuery 变量 最近 我通过在 StackOverflow 上遇到的另一个问题寻找帮助 了解到如何设置 JQuery 变量 如下所示 您可以通过简单地调用变量来创建输入字段 并且锚变量似乎也定义了样式 var clicked
  • PNG 透明度问题 - 带有黑色阴影的褪色图像 - IE 中的边框

    我使用图像旋转器在主页上显示一些图像 所有图像均为 PNG 格式 问题出在 IE 7 8 中 图像旁边有黑色阴影 我花了几个小时来解决这个问题 但仍然不知道问题出在哪里以及如何删除它 没有人有类似的问题和提示吗 如何解决 尝试使用 img
  • 我想检查 $('#td1').text() === "x" 是否?

    我想检查innerHtml是否有X或O 所以我不能再次添加任何其他东西 但它不起作用 添加检查代码后它就停止了 我在这里尝试做一个简单的XO游戏来更熟悉javascript和jquery 我也不确定是否可以用 jQuery 做到这一点
  • 如何监听 jQuery AJAX 请求?

    以下两种实现 ajaxRequest 1 2 的方法应该是等效的 话说回来 为什么验证回调已执行的单元测试 3 在 1 中成功而在 2 中失败 我应该如何重写测试 3 来监视 2 中的成功回调 如果我尝试stub jQuery ajax使用
  • Jquery/Javascript 上传和下载文件,无需后端

    是否可以在没有后端服务器的情况下在 JavaScript 函数中下载和上传文件 我需要导出和导入由 JavaScript 函数生成的 XML 我想创建按钮 保存 xml 来保存文件 但我不知道是否可行 另一方面 我希望将 XML 文件直接上
  • 如何使用 JQuery 动态排序

    如果我有一个下拉列表和一个列表框 有没有办法使用 JQuery 根据下拉列表对列表框进行排序 举个例子会很有帮助 这会改变下拉菜单中的顺序 您必须根据自己的标准设置顺序
  • FireFox 中的自动滚动

    我的应用程序是实时聊天 我有一个 Div 来包装消息 每条消息都是一个 div 所以 在几条消息之后 我的 DOM 看起来像这样 div div Message number two div div div div
  • 长轮询会冻结浏览器并阻止其他 ajax 请求

    我正在尝试在我的中实现长轮询Spring MVC Web 应用程序 http static springsource org spring docs 2 0 x reference mvc html但在 4 5 个连续 AJAX 请求后它会
  • Javascript/Jquery:确定用户是否使用鼠标滚轮、滚动条或键盘滚动

    我正在尝试让用户界面正常工作 如果他们使用鼠标滚轮 我需要让它以一种方式滚动 如果他们使用滚动条 我需要让它以另一种方式滚动 如果他们使用键盘 我需要让它以另一种方式滚动 我相信滚轮和滚动条都充当鼠标事件 但是当单击滚动条时我无法让 jav
  • jQuery 对象相等

    如何确定两个 jQuery 对象是否相等 我希望能够在数组中搜索特定的 jQuery 对象 inArray jqobj my array 1 alert deviceTypeRoot deviceTypeRoot False alert d
  • Spring Rest 和 Jsonp

    我正在尝试让我的 Spring Rest 控制器返回jsonp但我没有快乐 如果我想返回 json 但我有返回的要求 完全相同的代码可以正常工作jsonp我添加了一个转换器 我在网上找到了用于执行 jsonp 转换的源代码 我正在使用 Sp
  • fullCalendar 未显示正确的结束日期

    我正在看调试页面 http jsbin com wukofacaxu edit js outputFullCalendar 官方网站的 我想安排一个活动时间为 22 09 2015 至 30 09 2015 dd mm yyyy 但它只显示

随机推荐

  • 如何递归地将项目添加到列表中?

    目前 我正在解决一个问题 我得到一个列表 其元素可能包含其他列表 列表的列表或整数 例如 我可能会收到 1 2 3 4 5 6 7 9 我的目标是解析数组并附加仅整数到一个新列表 这是我到目前为止所做的 def fun a if a ret
  • Django Admin:列表中的分组数据

    我可以在 Django Admin 中显示分组结果吗 默认情况下 它们显示所有行 我想根据某些字段对这些行进行分组并显示它 像 GROUP BY username 之类的东西 我尝试过搜索但没有成功 使用怎么样list filter my
  • IMFMediSource 不支持 IKsPropertySet 接口

    我正在将基于 Direct Show 相机的 SDK 移植到 MFT 在我的旧代码中 我有 KSProxy 接口 如 IksTopolgy IKsControl 和 IKsProperty IksTopolgy IKsControl 用于枚
  • 如何在 JavaScript 中将值从一个 html 页面传递到另一个页面?

    我知道这个问题问了很多次 但我的问题有所不同 我有 3 个 html 页面 例如apply html personal info html resume info html 在 apply html 页面中 我使用一个 LinkedIn 按
  • 从 android init.rc 执行静态程序

    我想在以下位置启动一个自定义程序init过程 我静态编译了这个程序 它可以在我启动的 android stock ROM 中正常运行 来自安卓init rc我读到的文档exec命令是我需要的 顺便说一句 我能看到的都是dmesg我的程序退出
  • 如何在Azure功能上安装apt-get包

    在 Linux 消费计划上运行 python Azure 函数 我已经能够使用 VS Code 成功将该函数部署到 Azure requirements txt 中的所有包都可以顺利安装 但现在我需要安装tesseract 它只能通过apt
  • 是否可以对特定于浏览器的 CSS 使用 mixin

    我正在寻找一种使用 mixin 进行特定于浏览器的 CSS hack 的解决方案 我正在使用 JavaScript 在 HTML 类中添加浏览器标签 喜欢 ie ie7 ie8 ie9 我想使用 mixin 像 box test margi
  • 创建自定义 DatePicker 对话框

    要求 当用户单击 TextView 时 应打开一个日期选择器 选择的默认日期应该是 TextView 中的日期 如果日期是过去的日期 则应禁用 DatePicker 对话框的 设置 按钮 如果可点击的 TextView 为空 则 DateP
  • 数据库驱动类动态加载

    我想用 java 开发一个与数据库无关的应用程序 我选择hibernate作为ORM jdbc的问题在于 它只是一个接口 我们需要在类路径中包含db的驱动程序类 由于数据库应该是可配置的 我必须动态加载数据库的驱动程序类 用户应该将驱动程序
  • graphviz - 如何在矩形布局中以循环方式排列节点?

    预脚本 就在我完成这些示例时 我看到了 往返 流程主题 https stackoverflow com questions 18877045 graphviz how to create a roundtrip flow 看起来不错 既然我
  • 图片上方半透明div

    我有一个角色的 PNG 图像 我想要类似的东西 http www swfcabin com open 1364482220 http www swfcabin com open 1364482220 如果有人点击角色身体的一部分 它将被 选
  • Django REST Framework - 如何返回 404 错误而不是 403

    仅当用户经过身份验证并且满足某些其他条件时 我的 API 才允许访问 任何请求 某些对象 class SomethingViewSet viewsets ModelViewSet queryset Something objects fil
  • 我们有专门针对 Spring 5.x 的 XSD 吗?

    谁能告诉我 Spring 5 版本的 XSD 是否可用 有没有类似的东西spring beans 5 1 xsd spring context 5 1 xsd spring mvc 5 1 xsd or spring beans 5 0 x
  • C++ Linux 与另一个程序交互 stdin / stdout

    我在 Linux 中有一个可以与 stdin stdout 交互的可执行文件 我正在尝试用 C 编写一个程序 它可以交互地调用该程序 向其标准输入发送命令 并捕获其标准输出 我真的很困惑 我不想分叉我的程序 是吗 我确实希望我的程序能够启动
  • 异步连接管道

    我想将相同的信息写入两个管道 但我不想等待第一个管道读取 这是一个例子 mkfifo one mkfifo two echo hi tee one two cat one cat two cat one直到开始阅读cat two正在运行 有
  • 我如何请求浏览器始终更新(也称为从不缓存)某些页面元素,例如 CSS 表?

    我在开发页面时注意到一个始终困扰我的问题 虽然 Firefox 我常用的 开发 浏览器 总是在服务器上更改 CSS 和图像时更新它们 但 Internet Explorer 并不总是这样做 通常 我需要刷新 IE 中的页面 然后它才会向服务
  • 使用Selenium + Scrapy

    我正在尝试将 scrapy 与 selenium 结合使用 以便能够与 javascript 交互 并且仍然拥有 scrapy 提供的强大的抓取框架 我写了一个访问的脚本http www iens nl http www iens nl 在
  • EntityFramework.6.1.2-beta1\tools\init.ps1 受到限制,无法运行enable-migrations 命令

    Visual Studio 2013 C ASP NET MVC 问题 EntityFramework 6 1 2 beta1 tools init ps1 无法加载 因为其执行被软件限制策略阻止 有关详细信息 请联系您的系统管理员 当我尝
  • Android Studio 收到“必须实现 OnFragmentInteractionListener”

    我收到一条消息 上面写着 必须实现 OnFragmentInteractionListener 而且我已经有了它 我已经查看了这里提出的每个问题 但没有人帮助我 有人可以帮我吗 ERROR FATAL EXCEPTION main Proc
  • 如何找出 next() 何时到达末尾,然后转到第一项

    我使用 next 函数显示一系列元素 不过 一旦到达终点 我想转到第一个元素 有任何想法吗 这是代码 Prev Next Click nextSingle click function Get the height of the next