jQuery Slideup / Down追加问题

Question

$(".item").hover(
  function () {
    $(this).slideDown().append(
            $("<div class=\"attending\">Yes/No</div>")
        );
  }, 
  function () {
    $(this).find("div:last").slideUp().remove();
  }
);

我使用上面的代码在翻转时将div附加到元素的底部。我有一些.item div，每一个都在翻转时附加到它们上面，但由于某些原因我无法进行滑动/上升工作。

有什么想法吗？

Answer 1

$(".item").hover(
    function () {
        var answer = $("<div class=\"attending\">Yes/No</div>").hide();
        answer.appendTo($(this)).slideDown();
    }, 
    function () {
        $(this).find("div:last").slideUp("normal", function() {
            $(this).remove();
        });
    }
);

它不会滑落！

您将错误的子项附加到错误的元素，并且您忘记先隐藏该元素。

它不会向上滑动！

此行开始向上滑动，但不等待动画完成并删除元素。

$(this).find("div:last").slideUp().remove()

Answer 2

直觉我会说你在错误的元素上调用幻灯片效果。它是在.list而不是div.attending上调用的，这是我想要出现的框。

Answer 3

试

$(".item").hover(
  function () {
    $(this).append(
        $("<div class=\"attending\">Yes/No</div>").hide();
    ).find("div:last").slideDown();
  }, 
  function () {
    $(this).find("div:last").slideUp("normal", function() {
      $(this).remove();
    });
  }
);

Answer 4

我遇到了类似的问题。正在使用 .append（）;尝试使用回调函数 - 但根本没用。  所以，做了一个技巧并取得了成功。采取简短外观。  这是步骤 -

• 附加内容;每当调用append-function-block时，取一个变量并保持其值递增 为该元素设置带有该变量的id并保持隐藏。

function add_more_charge()
{
var i = $("#store_id_value").val();
var id = 'some_id_'+i;
var str= '<div style="display:none" id="'+id+'">...............</div>';
$("#store_id_value").val(++i);
$("#additional_charges").append(str);
$("#"+id).slideDown();
}

此处，{ - 1}} 存储一个值，并在每次调用时递增。

我们可以生成随机数。使用全局变量也是一个不错的选择。

Answer 5

$(".item").hover(
  function () {
    var content = $(this).append($("<div class=\"attending\">Yes/No</div>")).hide();
    $('.attending').last().slideDown();
  }, 
  function () {
    $(this).find(".attending").last().slideUp("normal", function() {
      $(this).remvove();
    });
  }
);

试试这有点hackish，但它的工作。