Question

我正在开发单页asp.net-mvc5应用程序....

我的代码中有一个隐藏的div，我试图在ajax成功时显示这个div但是失败了...我怎么能实现这一点，我做得对吗???

在放置“显示：无”之前，动画功能正常工作成功，现在它不起作用也因为隐藏的性质我猜...

HTML

<section class="block remove-top" id="contact-us" style="display: none;">
<form method="post" action="" name="contactform" id="contactform">
<div class="row">
<input name="FirstName" type="text" id="FirstName"/>
<input type="submit" class="submit" id="btnSubmit" value="Submit" />
</form>
</section>

的Ajax

<script>
    function packageSelect(PackageId) {
        $.ajax({
        type: "POST",
        url: '@Url.Action("SelectPackage", "Home")',
        dataType: "JSon",
        data: { "PackageId": PackageId },
        success: function (data) {
            console.log(data);
            //$("#SecondInfo").focus({ scrollTop: "0px" });
            $('html, body').animate({ scrollTop: $('#contact-us').offset().top }, 'slow');
        },
        error: console.log("it did not work"),
    });
};
</script>

如果有人帮忙，请提供任何形式的帮助....感谢您的时间：）

Answer 1

有关

<section class="block remove-top" id="contact-us" style="display: none;">

您可以使用show()之类的

来展示它

$('#contact-us').show();

因此，请将代码更新为

function packageSelect(PackageId) {
        $.ajax({
        type: "POST",
        url: '@Url.Action("SelectPackage", "Home")',
        dataType: "JSon",
        data: { "PackageId": PackageId },
        success: function (data) {
            console.log(data);
            //$("#SecondInfo").focus({ scrollTop: "0px" });
            $('#contact-us').show();
            $('html, body').animate({ scrollTop: $('#contact-us').offset().top }, 'slow');
        },
        error: console.log("it did not work"),
    });

Answer 2

在制作动画之前使用$('.element-name').show()。

Answer 3

show动画前的元素。

$('#contact-us').show();

$('html, body').animate({ scrollTop: $('#contact-us').offset().top }, 'slow');

如果您想要隐藏元素：

$('#contact-us').show();

$('html, body').animate({ scrollTop: $('#contact-us').offset().top }, 'slow', function() {
    $('#contact-us').hide(); // Hide element after scroll is completed
});

如何在ajax成功调用中显示隐藏的div

3 个答案: