Question

我有一个调用jQuery脉冲函数的函数。我在客户端界面的小图形上使用它，表明某些数据正在与服务器同步。在传输数据时，脉冲功能生效，使图形看起来像闪烁的光。

除了那个小指标图形外，还有一些文字。因此，当同步完成时，脉冲停止，图形变为绿色，文本显示“数据已同步”。

一切都很好，除了由于我不理解的原因，停止脉冲效应的功能仅在大约50％的时间内起作用。但是，更改为“数据已同步”的文本在100％的时间内都可以正常工作。

我怎么能在代码中找到执行这两个操作的点，但只有一个实际发生？在我看来，它们既可以工作，也可以两者都失败。（我试过改变他们的顺序，但这对问题没有任何影响。）

以下是相关代码。第一个函数在数据开始同步时执行，另一个函数在服务器发回JSON“执行良好：数据同步”时执行。

另外请注意，我是一个菜鸟，所以请愚蠢回答我的水平。

function syncDataStart()
{
    $(document.getElementById("indicator")).pulse(
    {
        backgroundColor: ["yellow", "orange"]
    }, 100, 9999, "linear");
    document.getElementById("indicator-text").innerHTML = "synchronizing data";
}

function syncDataComplete()
{
    document.getElementById("indicator-text").innerHTML = "data synced";
    $(document.getElementById("indicator")).stop();
    document.getElementById("indicator").style.backgroundColor = "green";
}

Answer 1

好的，这次肯定解决了。

原来问题不在于stop（）方法，而在于如何启动脉冲。我会尝试解释这一点，这样才有意义，希望对有类似问题的其他人有所帮助。

我的错误是假设当一个人在一个命名元素（在我的情况下是#indicator div）上开始一个脉冲动画时，那个脉冲效果只是“开启”，并且可以简单地关闭。我认为它是二进制的，有点像是如何启用或禁用按钮元素，并且尝试再次禁用它不会做任何事情。

然而，现实情况是脉冲效应是累积的。换句话说，如果你在同一个元素上调用脉冲效果，它会在现有元素之上添加另一个脉冲。

在我的界面中，我有一些不同的小部件可以打开指示脉冲效果。我没有意识到的是，在某些情况下，他们每个都会在任何正在运行的脉冲效果之上添加新的脉冲效果。

因此，当调用stop（）方法时，它可能正在停止其中一个运行脉冲效果，但其他方法仍在运行，使其看起来好像脉冲效应只是继续。（如果有代码说“停止所有正在运行的动画......”

，这可能会有所帮助

我只是添加了一个存储值的变量，该值可以说明是否已经存在脉冲效应。如果有，那么不要开始新的。这样，我确保任何时候只有一个脉冲效果，stop（）方法可以杀死它。

感谢大家提供的有用解释，并花时间编写示例代码，让我了解我应该期待的内容。

Answer 2

修改

尝试使用.stop(true,true)之类的

$(document.getElementById("indicator")).stop(true,true); OR

$("#indicator").stop(true,true);

Answer 3

您提供的代码适用于James Padolsey的Pulse插件和my test page上的John Resig的Color插件。

您提供的代码也与document.getElementByID（“indicator”）和“#indicator”完美配合。使用哈希时它在你的页面上打破对我来说似乎很奇怪。我会在代码的其他部分中查找错误：

还有其他什么东西可以访问指标元素吗？
您使用的是哪些插件？你自己写过任何可能相关的内容吗？
有什么东西可以干扰/破坏JQuery的dom导航吗？

祝你好运。

为什么一个Javascript操作正在执行而另一个不执行？

3 个答案: