时间戳

首页 > 解决方案 > 如何检查 jQuery int 变量是否已更改？

javascript - 如何检查 jQuery int 变量是否已更改？

问题描述

我目前正在使用 jQuery 制作一个简单的滑块，我只显示变量默认情况下等于 1<ul>的第一个元素。.slice((slideIndex - 1), slideIndex)slideIndex

我有一个函数可以将 +1 添加到该值，但该值不会改变。

这是一个JSFiddle

这就是我尝试过的，为什么我的变量没有改变？如何检查它是否已更改？

标签： javascripthtmljquery

解决方案

您的全局变量的值确实在您的函数中发生了变化，但您没有对<li>s 的可见性状态做任何事情。和函数只在页面加载.hide()后.show()执行一次。

我准备了一个小替代脚本，希望能满足您的要求：

每次单击该按钮时，它都会执行以下操作：

  • 它是您的 jquery 选择中.hide()的所有元素，<li>$('#slider li')
  • 然后它找到第idx-th<li>元素并使其再次可见 ( .show())
  • 这样做时它会idx增加到下一个值
  • 最后附加.click()触发加载后的第一个按钮单击。

该构造(idx%len)确保.eq()- 位置仅限于现有值。

const ul=$('#slider li'),len=ul.length;

var idx=0;
$('#controlNext').click(ev=>ul.hide().eq((idx++)%len).show()).click()
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="controlNext">next</button>

<div id="slider">
  <ul>
    <li>slide1</li>
    <li>slide2</li>
    <li>slide3</li>
    <li>slide4</li>
    <li>slide5</li>
  </ul>
</div>

脚本的稍微“更干净”的版本（更少的全局常量和变量）如下所示：

const ul=$('#slider li');
ul.idx=0

$('#controlNext').click(ev=>ul.hide().eq((ul.idx++)%ul.length).show()).click()

ul现在是唯一的 global ，其中包含带有-collectionconst的 jquery 对象。<li>然后我直接使用它.length的属性.idx并向它添加一个额外的属性（而不是使用全局变量）。

推荐阅读