Question

我对jquery了解不多，但我知道这是实现这种效果的唯一方法。

目前的代码：

JQUERY：

<script type="text/javascript">
    var settimmer = 0;
    $(function(){
            window.setInterval(function() {
                var timeCounter = $("b[id=show-time]").html();
                var updateTime = eval(timeCounter)- eval(1);
                $("b[id=show-time]").html(updateTime);

                if(updateTime <= 0){
                    $("#timer").load("images/logo.png");
                }
            }, 1000);

    });
</script>

HTML：

<div id="timerwrap"> <div id="my-timer"> <b id="show-time">100</b> </div> </div>

我想知道任何人都可以帮忙实现这一点当我将鼠标放入周围的div倒计时开始时，当计时器点击“0”时更改#timerwrap中的背景图像？

非常感谢你们。

Answer 1

首先要说几点。

使用ID时，您不需要b[id=show-time]之类的选择器，只需使用#show-time。

其次，你应该总是避免eval，加上你真正想要的是parseInt - 当然你永远不需要评估一个字面数字。

var updateTime = parseInt(timeCounter,10) - 1;

现在，为了回答你的问题，你需要在mouseover的事件处理程序中执行你的函数。此外，您应该只启动计时器一次，并记住在达到0时停止计时器

$(function(){
    var timerId = 0;
    $('#timerwrap').mouseover(function(){
        if(timerId == 0){
            timerId = window.setInterval(function() {
                var timeCounter = $("#show-time").html();
                var updateTime = parseInt(timeCounter,10) - 1;
                $("#show-time").html(updateTime);

                if(updateTime <= 0){
                    clearTimeout(timerId);
                    $("#timer").css({background:"url(images/logo.png)"});
                }
            }, 1000);
        }
    });
 });

实例：http://jsfiddle.net/vEsxC/

Jquery在mouseenter div上开始倒计时，然后在“0”上显示图像

1 个答案: