Question

我正在尝试使用jQuery制作一个简单的动画。我尝试在外部（外部文件）和内部（在脚本标记内）添加脚本。我已经测试了页面是否使用alert函数识别脚本，但脚本没有执行。我认为这与语法有关。

$("#container5").hover(function() {
        //hover in
        $(#container5).animate({
            height: "250",
            width: "250",
            left: "-=50",
            top: "-=50",
            }, "fast");
            }, function() {
            //hover out
            $(#container5).animate({
            height: "200",
            width: "200",
            left: "+=50",
            top: "+=50",
            }, "fast");
        }
    })(jQuery);

Answer 1

您需要将代码包装在ready函数中。问题是你的jQuery正在运行，因为DOM准备好了。这将有效。

jQuery(document).ready(function($){
    $('#container5').animate({
       height: "250",
       width: "250",
       left: "-=50",
       top: "-=50"
    }, "fast");
});

Answer 2

你需要将代码包装在一个就绪处理程序中，另外你还需要用引号包装你的字符串。

你似乎也有一个破坏的功能设置，正如Hellion所说，你不应该在你正在做的事情上将jQuery传递给一个函数。相反，你需要将所有代码包装在一个匿名函数中，并使用$作为参数，并将jQuery传递给它。这样可以防止可能使用全局$ var。

的其他库

将来有助于您发现这些问题的三件事。

具体说明你的缩进。这将更容易突出问题。
使用带有语法/代码突出显示的文本编辑器 - 这将显示您的字符串错误。
检查您使用的浏览器中的错误控制台，这会给您一些关于非法语法布局的提示。

以下内容应解决您的问题：

;(function($){
  $(function(){
    $('#container5').hover(
      function(){
        $('#container5').animate({
          height: "250",
          width: "250",
          left: "-=50",
          top: "-=50",
        },"fast");
      },
      function() {
        $('#container5').animate({
          height: "200",
          width: "200",
          left: "+=50",
          top: "+=50",
        },"fast");
      }
    );
  });
})(jQuery);

Answer 3

除了没有现成的处理程序之外，你的语法有点偏差：

1：你的#container总是需要引号Ex：$（'＃container5'） - 或者你可以在悬停动画上使用$（this）因为它在同一个容器上

2：顶部后面有一个额外的逗号：“+ = 50” - 取出来。动画的最后一行或{}中的任何内容最后都不能有逗号。

3：把它放在准备好的功能中。

这是更新后的代码：

$(document).ready(function(){
    $("#container5").hover(
    function() {
        $(this).animate({height: "250", width: "250", left: "-=50", top: "-=50"}, "fast");
    }, 
    function() {
        $('#container5').animate({height: "200", width: "200", left: "+=50", top: "+=50"}, "fast");
    });
});

请注意：我使用了$（this）和$（'＃container5'）。在这种情况下，您可以互换使用这些。 Read up on $(this)如果您想了解更多动态事件。

jQuery代码无法理解标记

3 个答案: