Question

我有以下动画：

           $(this).animate({
              marginLeft: '-25%',
              width: "50%",
              minWidth: '400px',
              maxWidth: '700px',
              padding: 0,
              minHeight: "580px",
              height: 'auto',
              borderRadius: 0
            }, 1000, function () {
              alert("I'm not being displayed!!");
              $(this).addClass('completed');
            });

一切似乎都没问题，但是在IE7或8中没有调用回调。为什么会这样？我删除了修复原始动画问题的borderRadius之后的最后一个逗号，但现在这是新问题。有人可以帮忙吗？

编辑：

带有标点符号错误的最终警报实际上并不在代码中，我只是将它放在那里以避免人们指出addClass部分可能是问题所在！

Answer 1

在“我是”

中添加一个转义符

  $(this).animate({
                      marginLeft: '-25%',
                      width: "50%",
                      minWidth: '400px',
                      maxWidth: '700px',
                      padding: 0,
                      minHeight: "580px",
                      height: 'auto',
                      borderRadius: 0
                    }, 1000, function () {
                      alert('I\'m not being displayed!!'); // needed an escape
                      $(this).addClass('completed');
                    });

Answer 2

你也可以试试这个：

$(this).animate({
          marginLeft: '-25%',
          width: "50%",
          minWidth: '400px',
          maxWidth: '700px',
          padding: 0,
          minHeight: "580px",
          height: 'auto',
          borderRadius: 0
        }, 1000).promise().done(function(){
          alert("I'm not being displayed!!"); // <---use double quotes or escape them
          $(this).addClass('completed');
        });

Answer 3

对于任何有兴趣的人，我发现了问题所在。显然IE 7和8在animate函数中处理height: 'auto'时遇到了问题，这导致它不会触发回调。

我决定使用反复试验来评论某些属性，直到我在阅读完这个问题的答案后找到了罪魁祸首 - jQuery example (in jsfiddle) working in firefox but not in IE8, 7 - Jeff B

IE 7/8中未执行jQuery动画回调

3 个答案: