jquery更改html，并在新的html中使用slideDown

jquery change html and use slideDown in the new HTML

本文关键字：html slideDown 更改 jquery      更新时间：2024-06-30

我正试图使用.html更改我的一段html，但我想添加一些幻灯片向下的效果，所以我尝试如下：

$('.section').slideDown(500, function () {
    $(this).html(html);
});

但不起作用，html更改但动画没有发生。

我做错了什么？

示例：

<p class="click">Click me</p>
<div class="section">
    <p> ONE </p>
    <p> ONE </p>
    <p> ONE </p>
    <p> ONE </p>
    <p> ONE </p>
</div>

$('.click').on('click', function() {
    $('.section').slideDown(500, function () {
        $(this).html('two');
    });
});

Fiddle：http://jsfiddle.net/fa7Ld2j1/

您可以使用以下序列：

$('.click').on('click', function () {
    $('.section').slideUp(4500, function () {
        $(this).find('p').html('two');
        $('.section').slideDown(500)
    });
});

jsFiddle示例

加载html的函数被称为success函数，即在动画完成后。

你可能可以试试这个：

$('.section').hide(); // hide the section
$('.section').html(html); // populate..
$('.section').slideDown(500); // Slide Down

希望能有所帮助…：）

编辑：可以检查幻灯片的参数向下在这里

slideDown用于显示隐藏的内容，请尝试slideUp，然后在回调函数中添加alert（…）。您将看到效果。希望它能帮助

相关文章：