Slidedown不使用新创建的html

时间:2014-09-25 14:09:50

标签: javascript jquery slidedown

<div id="usu" ></div>  

然后我有脚本应该添加内容:

<script>
  var haelisaanro = 10
  function haelisaa() {
      $.getJSON("/json/index_oikea.aspx?usu=1", function (data) {

          var items = [];
          items.push("<div id='rivit" + haelisaanro + "' >");
          $.each(data, function (key, val) {
              items.push("<div class=\"col-md-12 column nlnyR  \"><table><tr><td><div class=\"ot\"><span class=\"glyphicon glyphicon-play\"><\/span><\/div><\/td><td><a href='" + key + "'>" + val + "</a><\/td><\/tr><\/table><\/div>");
          });
          items.push("</div>");

          $("#usu").append(items.join(""));
          $('#rivit' + haelisaanro).hide();
          $('#rivit' + +haelisaanro).slideDown("slow", function () {
              // Animation complete.
          });
      });
      haelisaanro += 10;
  }
  </script> 

我也有这个页面加载:

<script>

$(document).ready(function() {
    $( "#oikear" ).load( "/index_oikea.aspx", function() {
          $( "#oikear2" ).load( "/index_oikea2.aspx", function() {
                    //alert('lahataanTop of thing hit top of viewport.');
            });

        });

});




</script>

index_oikea.aspx加载到#oikear div。已加载的内容在loded内容index_oikea.aspx中间有<div id="usu" ></div>

确实填补了&#34; usu&#34;有数据,但没有滑动动画。

我尝试将高度属性css添加到id =&#39; rivit&#39;。看起来它需要高度才能工作,但我无法让它以正确的高度尺寸工作。

我认为这不起作用的主要原因是浏览器无法以某种方式计算动态添加内容的高度......?

如果我更改代码...添加此样式:

<style>
.dplno{display: none;}
</style>

改为:

   items.push("<div class=\"col-md-12 column nlnyR dplno  \"><table><tr><td><div class=\"ot\"><span class=\"glyphicon glyphicon-play\"><\/span><\/div><\/td><td><a href='" + key + "'>" + val + "</a><\/td><\/tr><\/table><\/div>");

并改变这一点:

$( '.dplno' ).slideDown( "slow", function() {

现在每个div线都滑出来,但每一条线都是一个接一个地滑动。我需要将所有这些线滑动到一起。

2 个答案:

答案 0 :(得分:0)

您正在使用+ +符号连接,这可能是问题

$('#rivit' + +haelisaanro).slideDown("slow", function () {
              // Animation complete.
          });

因此可能会形成错误的身份。

更改为:

$('#rivit'+haelisaanro).slideDown("slow", function () {
              // Animation complete.
          });

答案 1 :(得分:0)

您在应用slideDown之前隐藏了div。这可能会导致您的问题。 您应首先定义动画,然后隐藏div。

$('#rivit' + +haelisaanro).slideDown("slow", function () {
    // Animation complete.
});
$('#rivit' + haelisaanro).hide();