Question

我是jQuery的新手。我正在使用一些开源代码，其中部分显示在下面。我想用代码做的就是添加一个后续函数调用可以处理的变量（'testVar'）。有人可以更正我的代码，因为变量定义和处理程序不起作用。除了testVar变量之外，一切都有效。

$('#default').countdown({
    until: new Date(2011, 6, 15, 12, 30, 0),
    testVar: 'Testing',
    onTick: displayVariable
});

function displayVariable() {
    $(this).text(testVar);
}

谢谢。

编辑： @Pixeltweak ...根据您的要求。代码如下。我只是想创建一个我在网页上显示的文本阶段。我需要创建一个var来实现。

$(function () {

    // override regional defaults
    $.countdown.setDefaults({
        labels: ['years', 'months', 'weeks', 'days', 'hours', 'minutes', 'seconds'],
        labels1: ['year', 'month', 'week', 'day', 'hour', 'minute', 'second']
    });

    // Round #1 Start Times -- note each Date() must match the 'lockout' column in _playoff_bracket:matches 
    $('#defaultCountdown_01').countdown({
        until: new Date(2011, 4 - 1, 13, 19, 30, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_02').countdown({
        until: new Date(2011, 4 - 1, 14, 19, 30, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_03').countdown({
        until: new Date(2011, 4 - 1, 14, 19, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_04').countdown({
        until: new Date(2011, 4 - 1, 13, 19, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_05').countdown({
        until: new Date(2011, 4 - 1, 13, 22, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_06').countdown({
        until: new Date(2011, 4 - 1, 14, 22, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_07').countdown({
        until: new Date(2011, 4 - 1, 13, 19, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_08').countdown({
        until: new Date(2011, 4 - 1, 13, 22, 30, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });

    // Round #2 Start Times -- note each Date() must match the 'lockout' column in _playoff_bracket:matches 
    $('#defaultCountdown_09').countdown({
        until: new Date(2011, 4 - 1, 29, 19, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_10').countdown({
        until: new Date(2011, 4 - 1, 30, 15, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_11').countdown({
        until: new Date(2011, 4 - 1, 28, 21, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_12').countdown({
        until: new Date(2011, 4 - 1, 29, 22, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });

    // Round #3 Start Times -- note each Date() must match the 'lockout' column in _playoff_bracket:matches 
    $('#defaultCountdown_13').countdown({
        until: new Date(2011, 5 - 1, 14, 20, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });
    $('#defaultCountdown_14').countdown({
        until: new Date(2011, 5 - 1, 15, 20, 0, 0),
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });

    // Round #4 Start Times -- note each Date() must match the 'lockout' column in _playoff_bracket:matches 
    $('#defaultCountdown_15').countdown({
        until: new Date(2011, 6 - 1, 1, 20, 0, 0),
        test: 'Testing',
        serverSync: serverTime,
        significant: 2,
        layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
        expiryUrl: '/nhl/playoffs/myAccount.html',
        onTick: additionalFormatting
    });

    // additional hightlighting for more than 1-day and within last-hour of pick
    function additionalFormatting(periods) {
        if ($.countdown.periodsToSeconds(periods) >= 86400) {
            $(this).text('You have until Wednesday at 8:00pm ET to finalize this pick');
            //$(this).text($(this).countdown.test);
            $(this).removeClass('hideIt');
            //$(this).addClass('hideIt'); // greater than or equal to 1-day (2011-05-28 changed this method for one above)
        }
        else $(this).removeClass('hideIt'); // less than 24 hours
        if ($.countdown.periodsToSeconds(periods) < 60) { // less than 1-minute
            $(this).addClass('highlightBold'); // change font-weight to bold
            //$(this).countdown('change', 'significant', 1); // eliminate minutes block -- does not work as I hoped for
            //$(this).countdown('change', 'layout', 'This Pick Closes in: {sn} {sl}'); // eliminate minutes block -- does not work either
        }
        else if ($.countdown.periodsToSeconds(periods) < 3600) $(this).addClass('highlight'); // less than 1-hour
    }

});

Answer 1

问题是您没有将testVar传递给displayVariable函数。我建议尝试这样的事情。

$('#default').countdown({
    until: new Date(2011, 6, 15, 12, 30, 0),
    onTick: function() {
        $('#myElement').text('Testing');
    }
});

Answer 2

看起来你正在使用jQuery Countdown插件，它似乎不支持这样的abitrary选项。你最好在函数中构建参数：

$('#default').countdown({
    until: new Date(2011, 6, 15, 12, 30, 0),
    onTick: displayVariable
});

function displayVariable() {
    $(this).text('Testing');
}

如果这不是一个选项（例如，如果你想重新使用该功能，你可以将它作为一个参数并使用委托给它的匿名回调：

$('#default').countdown({
    until: new Date(2011, 6, 15, 12, 30, 0),
    onTick: function(periods) { displayVariable(periods, 'Testing', 123); }
});

function displayVariable(periods, aVariable, aSecondVariable) {
    // do something with parameters
}

Answer 3

怎么样：

$('#default').countdown({
    until: new Date(2011, 6, 15, 12, 30, 0),
    onTick: displayVariable
}).data("testVar","Testing");

function displayVariable() {
    $(this).text($(this).data("testVar"));
}

Answer 4

您是否有任何理由不将其设置为正常变量？

var testVar_value = 'Testing';

$('#default').countdown({
    until: new Date(2011, 6, 15, 12, 30, 0),
    testVar: testVar_value,
    onTick: displayVariable
});

function displayVariable() {
    $(this).text(testVar_value);
}

Answer 5

这不是它的工作方式，你需要为它创建一个变量，而不是将一些对象传递给另一个函数。

这样的事情会起作用：

var testVar = 'Testing';
function displayVariable() {
    $(this).text(testVar);
}

或者使用像这样的对象文字：

var literal = {
    testVar: 'Testing'
}

function displayVariable() {
    $(this).text(literal.testVar);
}

Answer 6

问题是在您尝试从中调用它的上下文中不知道displayVariable。如果您确实需要displayVariable函数，则应执行以下操作：

注意：testVar在全局范围内定义

 $('#default').countdown({    
    until: new Date(2011, 6, 15, 12, 30, 0),    
    me: this,         
    onTick: function() { 
        me.testVar = 'blahdieblah';
        me.displayVariable();
 } });

Answer 7

来自aquinas的代码（对我来说是成功的）

// Round #4 Start Times -- note each Date() must match the 'lockout' column in _playoff_bracket:matches 
$('#defaultCountdown_15').countdown({
    //until: new Date(2011, 6 - 1, 1, 20, 0, 0),
    until: new Date(2011, 5 - 1, 29, 7, 29, 0),
    //test: 'Testing',
    serverSync: serverTime,
    significant: 2,
    layout: 'This Pick Closes in: {d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl} {s>}',
    expiryUrl: '/nhl/playoffs/myAccount.html',
    onTick: additionalFormatting
    //onTick: function(periods) { additionalFormatting(periods, 'This is a test'); } // Samir
//});
}).data("testVar","Test by aquinas"); // aquinas

// additional hightlighting for more than 1-day and within last-hour of pick
function additionalFormatting(periods) {
//function additionalFormatting(periods, textOverride) { // Samir
    if ($.countdown.periodsToSeconds(periods) >= 86400) {
        //$(this).text('You have until Wednesday at 8:00pm ET to finalize this pick');
        //$(this).text(textOverride); // this should come from Round #4 var Samir
        $(this).text($(this).data("testVar"));
        $(this).removeClass('hideIt');
        //$(this).addClass('hideIt'); // greater than or equal to 1-day (2011-05-28 changed this method for one above)
    }
    else $(this).removeClass('hideIt'); // less than 24 hours
    if ($.countdown.periodsToSeconds(periods) < 60) { // less than 1-minute
        $(this).addClass('highlightBold'); // change font-weight to bold
        //$(this).countdown('change', 'significant', 1); // eliminate minutes block -- does not work as I hoped for
        //$(this).countdown('change', 'layout', 'This Pick Closes in: {sn} {sl}'); // eliminate minutes block -- does not work either
    }
    else if ($.countdown.periodsToSeconds(periods) < 3600) $(this).addClass('highlight'); // less than 1-hour
}

jQuery如何添加变量

7 个答案: