javascript 如何在ajax成功调用上显示隐藏的div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30930852/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to show hidden div on ajax success call
提问by Suhail Mumtaz Awan
I am working on single page asp.net-mvc5 application....
我正在处理单页 asp.net-mvc5 应用程序....
I have a hidden div in my code, i tried to show this div on ajax success but failed...How can i achieve that, am i doing it right???
我的代码中有一个隐藏的 div，我试图在 ajax 上显示这个 div 成功但失败了......我怎样才能做到这一点，我做对了吗？？？
Before putting "Display:None", animate function was working fine on success, now its not working also due to hidden nature i guess...
在放置“显示：无”之前，动画功能在成功时运行良好，现在它也由于隐藏的性质而无法正常工作，我猜......
HTML
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>
Please if someone help, any kind of help will be appreciated....thanks for your time:)
请如果有人帮助，任何形式的帮助将不胜感激....感谢您的时间:)
回答by AmmarCSE
For
为了
<section class="block remove-top" id="contact-us" style="display: none;">
you can show it using show()like
您可以使用show()来显示它，例如
$('#contact-us').show();
So, update your code to
因此，将您的代码更新为
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"),
});
回答by Swaraj Giri
Use $('.element-name').show()before animating.
$('.element-name').show()在动画之前使用。
回答by Tushar
showthe element before animation.
show动画前的元素。
$('#contact-us').show();
$('html, body').animate({ scrollTop: $('#contact-us').offset().top }, 'slow');
If you want the element to be hidden:
如果要隐藏元素：
$('#contact-us').show();
$('html, body').animate({ scrollTop: $('#contact-us').offset().top }, 'slow', function() {
$('#contact-us').hide(); // Hide element after scroll is completed
});
