2

我是 javascript 的初学者，希望有人能帮我解决这个问题。我正在尝试制作一个 id 为“移动”的 div，来回滑动。该代码在 jsfiddle 中工作，但当我将其放入我的 html 文档时将无法工作。我尝试将顶部部分放在一个单独的 js 文件中，并仅使用代码的最后一行在头部调用变量：

animateMe($('#move'), 2000);

那没有用。然后我尝试将整个 js 脚本放入头部，但也没有用。这是我的 html 文档头部的代码：

<script type="text/javascript" src="javascript/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
 $(targetElement).css({ left: '50px', top: '50px' }).animate({
        'left': '200px'  },{
       duration: speed,
        complete: function () {
            $(this).animate({
            'left':'50px'
            },{
            duration: speed,
            complete: function () {
         animateMe(this, speed);
                }
            })
        }
        }
   ); 
  };
animateMe($('#move'), 2000);</script>

这是正文中的代码。我通常使用外部 css 文档，但为了尽量缩短内容，我在这里使用了内联 css。

<div id="move" style="position: absolute; width: 100px; height: 100px; background-color: green;"></div>

我从 jsfiddle 获取代码并将其放入头部或我单独的 js 文件中。不确定这样做是否是导致脚本无法工作的原因。任何帮助表示赞赏。谢谢大家。

这是我在 jsfiddle 上的工作的链接：http: //jsfiddle.net/wrdweaver6/r8Kf9/

4

2 回答 2

0

您想将代码放入其中

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

或者

window.onload = function() {
    // Your code here
};

在执行 javascript 之前，需要先加载所有元素。使用 jsFiddle 您不必这样做，但这可能是导致它无法在 jsFiddle 之外工作的原因。

于 2013-07-20T01:07:17.750 回答
0

您需要在代码周围添加它，$(document).ready(function(){   });以便您的代码在页面加载后运行。

否则代码将寻找尚不存在的 html。

$(document).ready(function(){
$(targetElement).css({ left: '50px', top: '50px' }).animate({
        'left': '200px'  },{
       duration: speed,
        complete: function () {
            $(this).animate({
            'left':'50px'
            },{
            duration: speed,
            complete: function () {
         animateMe(this, speed);
                }
            })
        }
        }
   ); 
  };
animateMe($('#move'), 2000);

});
于 2013-07-20T01:07:34.700 回答