1

我创建了一个函数，它跟踪我当前在哪张幻灯片上并显示结果，例如，如果我在 3 张幻灯片中的第 2 张上，它将显示 2/3

我的问题是，现在每次单击前进箭头时都设置为执行此操作，但在页面加载时不显示任何内容。

$('.forward').click(function() {
var current = $('#slider').data('AnythingSlider').currentPage; // returns page #
var count = $("#slider").children().length - 2;
$("#bottom-image").html(current + "/" + count) ;
});

我试图找出如何在页面加载时执行此功能以及将其放在我的代码中的位置。我目前正在通过 Codecadamedy 学习 Javascript，所以我对 Javascript 有基本的了解，但我现在还不够流利，无法弄清楚这一点。

这是当前非工作代码的链接：http: //www.soleilcom.com/metacor_dev/our-plants.php

4

3 回答 3

1

看起来您正在使用 jQuery。要在查询中执行 DOM 加载函数，请执行以下操作：

$(document).ready(function() {
    /* your code */
});

在你的情况下，那将是：

$(document).ready(function() {
    $('.forward').click(function() {
        var current = $('#slider').data('AnythingSlider').currentPage; // returns page #
        var count = $("#slider").children().length - 2;
        $("#bottom-image").html(current + "/" + count) ;
    });
});

对于大多数事件处理程序和大多数其他事情，在 DOM 加载时进行初始化就足够了。如果您的代码需要考虑渲染元素或渲染高度，请$(window).load()改用。（在您的情况下，DOM 加载很好）。

请注意，这只会在加载时建立点击处理程序。要同时运行一次，您可以通过自己调用函数或触发点击来自动执行它。要自己调用它，首先定义另一个函数。在单击处理程序和一次立即调用中使用该函数：

$(document).ready(function() {
    var forward = function() {
        var current = $('#slider').data('AnythingSlider').currentPage; // returns page #
        var count = $("#slider").children().length - 2;
        $("#bottom-image").html(current + "/" + count) ;
    }

    $('.forward').click(forward);
    forward();
});

或者要自己触发它，只需定义点击处理程序并以编程方式触发点击：

$(document).ready(function() {
    $('.forward').click(function() {
        var current = $('#slider').data('AnythingSlider').currentPage; // returns page #
        var count = $("#slider").children().length - 2;
        $("#bottom-image").html(current + "/" + count) ;
    }).click();
});
于 2012-04-11T15:44:22.410 回答
0

看起来你正在使用 jQuery，所以你会使用这个：

$(document).ready(function(){
    // Code here
});

或者，您可以使用快捷方式：

$(function(){
    // Code here
});

在jQuery 网站上阅读有关此内容的更多信息

于 2012-04-11T15:44:27.687 回答
0

如果你给函数一个名字，那么你可以多次使用它：

$(document).ready(function() {
    // Bind to click event
    $('.forward').click(forwardSlide)

    // Execute function on page load
    forwardSlide();
});

function forwardSlide() {
    var current = $('#slider').data('AnythingSlider').currentPage; // returns page #
    var count = $("#slider").children().length - 2;
};

这是你要找的吗？

于 2012-04-11T15:51:01.363 回答