1

我写了 jQuery 插件，模拟红绿灯的工作。您可以在此处查看演示，以及源代码：

$.fn.plugin = function (b/*time*/,a/*starting with given color*/) {
    b.push(b[1]);//adding phases time to plugin array 
    return this.each(function (f, d) {
        var
            e = ["#008000", "#FFFF00", "#FF0000", "#FFFF00"],//green,yellow,red,yellow
            c = function () {
                $(d).html(b[a])// here i want to place time, that left for current phase, it should change dynamicly
                    .css({
                        "background-color": e[a]//changing bg as light
                    });
             window.setTimeout(c, 1000 * b[a]);//hold phase as long as we told to plugin
             a = ++a % 4//result would be 0..1..2..3 and so on
            };
        c()
    })
};

$(window).load(function(){
$("#c1").plugin([2,2,2],0);
$("#c2").plugin([2,2,2],2);
})

</head>
<body>
Starts with red:<span id="c1" style="">&nbsp;</span><br>
Starts with green:<span id="c2" style="">&nbsp;</span><br>

因此，正如您所看到的，我正在选择元素、添加插件、为绿色、黄色、红色编写阶段时间，以及应该从什么颜色的红绿灯开始。

$(d).html(b[a])

这部分代码只是为当前阶段编写时间。我想把这个数字显示为相剩余的时间。

4

0 回答 0