" [对象窗口]"随机定位div时显示在html中

时间:2014-03-27 22:30:30

标签: javascript jquery html css

我正在这里建立一个网站http://msdhosting.co.uk/wp,我正试图对我制作的标题背景图像产生一个非常酷的效果。

我想要的是随机点出现然后再次消失(如网络ping)点缀在地图周围,好像它正在监视某些东西......

我已经制作了这段代码,它几乎可以正常工作,但是不会生成最高值,而是打印出来。

<h1>Top:</h1>[object Window]".

奇怪的事情正在发生,我无法弄清楚它是什么。这是代码:

function placeimage(){
      $div = $('header');
      $body = $('body');
      left = Math.floor(Math.random()*parseInt($div.innerWidth()));
      top = Math.floor(Math.random()*parseInt($div.outerHeight()));
      $div.append('<h1>Top:'+top+'</h1><img src="http://www.gravatar.com/avatar/e1122386990776c6c39a08e9f5fe5648?s=128&d=identicon&r=PG" alt="image" id="ping" onclick="doclick(this.id);" style="display: none; position: absolute;">');
      $img = $('#ping');
      $img.css('left',left+'px');
      $img.css('top',top+'px');
      $img.show();
      setTimeout(function(){hideimg();}, 5000);
      setTimeout(function(){placeimage();}, 3000);
}
function hideimg() {
    $img.remove();
}

placeimage();

有人可以帮我吗?

PS:使用的图像只是为了测试它!

1 个答案:

答案 0 :(得分:2)

因为top未声明为var top,所以您尝试将window.top连接到一个字符串,该字符串将被解析为对象窗口的字符串表示形式。

使用var声明所有变量并使用正确的连接运算符,您应该会看到问题消失。

在没有var的JavaScript中声明变量时,window对象获取变量的范围。当您使用var在函数内声明变量时,变量现在只对函数可见。

您绝对需要使用var声明JavaScript中的所有变量,否则您的程序将变得噩梦。

示例http://jsfiddle.net/rQw9y/

function foo() {
    x = 5;
    setTimeout(function () {
         alert(x);
    }, 5000);
}

function bar() {
    x = 'I change window.x this includes the one in the foo function';
}

foo(); // in 5 seconds alert will read "I change window.x this includes the one in the foo function"
bar();

通过使用x

在两个函数中声明var,可以轻松解决此问题

http://jsfiddle.net/rQw9y/2/