Question

我想要一个jquery代码，它创建一个包含给定内容的div，然后将其滑下来。

目前我有这段代码：

var newdivcontent = //ajax code here to bring new content
var newdivname = Math.floor(Math.random()*11);
$("#topofpage").after("<div id='"+ newdivname+"'>"+newdivcontent+"</div>");
$(newdivname).hide();
$(newdivname).slideDown("slow");


<div id="topofpage">Real Time Posts: <br></div>

但它只是创造了div而不是滑行。

谢谢

Answer 1

在线演示：http://jsbin.com/oroha

$("<div>").html("New Data").insertAfter("#topofpage").hide().slideDown("slow");

Answer 2

你似乎已经给你的div一个整数作为ID - 这将无效，JQuery将无法通过ID访问它。你需要一个'＃'选择器告诉JQuery你正试图通过id访问一个元素。试试这个：

var newdivcontent = //ajax code here to bring new content
var newdivname = "somediv_" + Math.floor(Math.random()*11);
$("#topofpage").after("<div id='"+ newdivname+"'>"+newdivcontent+"</div>");
$('#' + newdivname ).hide();
$('#' + newdivname ).slideDown("slow");

Answer 3

尝试使用HTML创建隐藏的div，然后使用slideDown：

var newdivcontent = //ajax code here to bring new content
var newdivname = Math.floor(Math.random()*11);
$("#topofpage").after('<div id="'+ newdivname + '" style="display: none;">' + newdivcontent + '</div>');
$('#' + newdivname).slideDown("slow");

<div id="topofpage">Real Time Posts: <br></div>

这两个动画可能没有像你期望的那样按顺序解析（这就是为什么它们有回调函数）所以看起来不对。

您还需要在隐藏/显示调用中使用正确的选择器，即它需要在选择器中包含div之前的＃。

Answer 4

我认为应该是：

$('#newdivname').hide();
$('#newdivname').slideDown("slow");

编辑：我的意思是：

$('#'+newdivname).hide();
$('#'+newdivname).slideDown("slow");

但是jacerhea已经给了那个

Answer 5

更改您的选择器以指定它是一个id属性，如此...

$("#" + newdivname).hide();
$("#" + newdivname).slideDown("slow");

如何使用jQuery slideDown一个新的DIV？

5 个答案: