0

我正在尝试加载一个外部 html 文件，该文件有一堆跨度标签，这些标签将计算我主页上特定类别列表中的内容数量以及我的其他页面，如“游戏（9）、电影（2）等等……”所以：

html要加载的内容ajax-

  <span class="category games">(0)</span>
  <span class-"category movies">(0)</span>

用于插入数字和加载的 ajax 内容的主要 html 代码 -

 <div id="categories">
  <span class="counter cgames">(0)</span>
  <span class="counter cmovies">(0)</span>
 </div>

javascript文件 -

    $( "#categories" ).load( "bunchofspans.html" );
    $(function() {
      var a = $(".movies").length;
            $(".cmovies").text("(" + a + ")");
          a = $(".games").length;
            $(".cgames").text("(" + a + ")");
    });

只需在 的隐藏 div 上添加具有特定类别的另一个跨度，就可以很容易地向计数器添加数字#categories，所以假设我在第 1 页上有 6 个游戏，然后在第 2 页我有另外 6 个，总共 12 个，这意味着我需要在我网站的每个页面中添加 12 个类别游戏的跨度，这非常耗时，因此如果我通过ajax这些跨度加载它，每个页面中都会有一个位置。

ajax 内容加载得很好，问题是，length()无论我如何添加更多跨度，似乎都不算数，数字不会在柜台上反击也不会增加。

4

4 回答 4

0

修改您javascript的调用function()作为回调load()：

$( "#categories" ).load( "bunchofspans.html" , function(){
    var a = $(".movies").length;
    $(".cmovies").text("(" + a + ")");

    a = $(".games").length;
    $(".cgames").text("(" + a + ")");
});

jQuery 文档

于 2013-10-29T06:52:01.043 回答
0

您可以使用以下方法执行此操作Callback Function：

$("#categories").load("bunchofspans.html", function () {
    alert("Load was performed.");
    var a = $(".movies").length;
    $(".cmovies").text("(" + a + ")");
    a = $(".games").length;
    $(".cgames").text("(" + a + ")");
});
于 2013-10-29T06:52:22.903 回答
0

span这里的问题是，无论是否加载了外部 html 内容，都会执行计算数量的函数。那是因为jQuery.load是异步的。
来自jQuery.load 文档

大致相当于 $.get(url, data, success)

因此，您只需在外部 html 内容完全加载后移动要执行的函数

$( "#categories" ).load( "bunchofspans.html",function() {
      var a = $(".movies").length;
            $(".cmovies").text("(" + a + ")");
          a = $(".games").length;
            $(".cgames").text("(" + a + ")");
});
于 2013-10-29T06:58:44.250 回答
0

您需要提供回调以加载，如下所示

$( "#categories" ).load( "bunchofspans.html",function() {
      var a = $(".movies").length;
            $(".cmovies").text("(" + a + ")");
          a = $(".games").length;
            $(".cgames").text("(" + a + ")");
});

有关更多信息，请参阅http://api.jquery.com/load/。

于 2013-10-29T06:52:59.360 回答