Question

我想要实现的是加载文件，计算它的类元素，然后显示它持续时间（2秒*没有元素）。

现在我可以使用jQuery加载该文件：

function load() {

  $(document).ready(function(){
    // load my file
    $('#content').load('phpScripts/someFile.php');
  });

  // count items
  i = $('.displayItem').length;
}

然后使用间隔

显示项目

setInterval(load, i*2000);

但我并不存在于此范围内（我以为我已将其声明为全局）;

然后我尝试使用ajax：

function start() {
    $(document).ready(function(){
        $.ajax({
            url: "phpScripts/infoScreenContent.php", 
            dataType: 'html', 
            success: function(data) {
              $("#content").html(data);

              i = $('.displayItem').length;
              alert(i); 

            }
        });     

    });
    //  return i;  
}

start();

现在我=我的元素的计数在函数内部工作，但我需要将它传递给另一个函数

setInterval(start, i*2000);

但我= 0;

我试图像在PHP中那样返回它，但它不起作用。

我会感激一些提示。

Answer 1

$(document).ready(...)函数的第一个参数传递的代码仅在文档完成加载时执行。因此，在您的第一个示例中，当您致电setInterval(load, ...)时，您说每个i * 2000毫秒：“文档完成加载后，将'phpScripts/someFile.php'加载到$('#content')”。但该文件只完成一次加载，对吗？

这是你的第一个问题 - 加载更多内容的代码只会执行一次。

现在使用setInterval，一旦启动它，它将以相同的间隔永远持续下去。您无法通过更改i的值来调整它。为什么？因为在执行行setInterval(load, i*2000);时只计算一次间隔。 表达式 i*2000转换为值，然后传递给函数setInterval。

如果要执行一些更改延迟的代码，则应使用setTimeout。这就是我的意思：

$(document).ready(function(){

  var elementDisplayTime = 500;
  // All functions defined inside this scope will 'see' this variable.

  function loadNext() {
    // Your code for loading new content here
  }

  function clock() {
    // Load next item
    loadNext();

    // See for how long we have to display it
    var count = $('.displayItem').length;

    // Schedule changeover after delay depending on count
    window.setTimeout(clock, count * elementDisplayTime);
  }

  // Start the clock
  clock();
});

我的相关jsfiddle。

使用jQuery加载文件，计算类的元素并设置区间比率

1 个答案: