Chrome和Safari中的jQuery问题：在Mozilla和Opera中运行正常：请帮忙

我在Chrome和Safari中遇到jquery问题，该脚本在Mozilla和Opera中运行正常。Chrome和Safari中的jQuery问题：在Mozilla和Opera中运行正常：请帮忙

当你点击按钮，所有的箱子应该在textare川方往下走，则该值在第一个框，同样应该发生，因为很多时候你点击按钮，这在Mozilla和Opera中工作正常，但不是Chrome和safari（也在IE6中），在这些浏览器中没有新盒子下来，只存在

请给我解决方案（请检查源代码）：

<script language="javascript" src="jquery-1.4.2.min.js"></script> 
<script language="javascript"> 
    $(document).ready(function() { 
     var top = 0; 
     $('#contents div').each(function(index, val) { 
      $(this).css('top', top + 'px'); 
      top = top + 61; 
     }); 

     $('#btn').bind('click', function() { 
      $('#contents div').each(function(index, val) { 
       var newtop = parseInt($(this).css('top')) + 61; 

       //$(this).css('top',newtop +'px');; 
       $(this).animate({ 
        top: newtop + 'px' 
       }, 800, function() { 
        // 
       }); 
      }); 

      $('#contents div:first').before('<div class="link">' + document.getElementById('val').value + '</div>'); 
     }); 
    }) 
</script>

来源

2010-10-12 Thomas John

它创建新的'div'很好，但他们没有正确地移动。 ...为什么在使用jQuery时使用'document.getElementById（）'？ – 2010-10-12 18:22:49

您的问题是你想动画新元素上不存在的属性。当你运行你的初始document.ready时，你会给每个div一个0或61 x n的最高值。当你创建新的div时，你没有给出任何最高值，所以jQuery不能从null动画到61或其他任何东西。你可以在这里做两件事：在你的.link类中设置一个默认的顶级值，或者在你添加的div的style属性中设置一个特定的顶级值。在这里看到一个工作示例：

http://jsfiddle.net/tns4H/

它这里需要注意的是非常重要的，那就是，你的动画需要800毫秒。如果你在小于800ms的时间点击两次按钮，jQuery将不会读取最终的top值，它将读取当前值。快速点击linkit按钮查看我的意思。

来源

2010-10-12 18:27:25 treeface

所有新建的箱子都在铬合金中互相坐在一起，因为没有任何元素样式“顶部”将其推倒。尝试在此行中添加一个顶级的风格在div：

$('#contents div:first').before('<div class="link">'+document.getElementById('val').value+'</div>');

来源

2010-10-12 18:23:06

您.link CSS规则改成这样：

.link{ 
    border:#CCCCCC solid 1px; 
    margin:5px; 
    height:55px; 
    position:absolute; 
    width:588px; 
    top:0; /* <-- the key */ 
}

Demo

来源

2010-10-12 18:26:23

Chrome和Safari中的jQuery问题：在Mozilla和Opera中运行正常：请帮忙

回答

相关问题