javascript - Jquery淡出项目，项目不会重新出现

Question

我的主页包含一个 DIV，而 DIV 又包含一个 IFRAME。当用户单击 IFRAME 中的 OK 按钮时，我在父页面中调用一个函数，该函数使用 Jquery fadeOut 命令淡出 div。当我尝试让 DIV 再次淡入时，它没有。我究竟做错了什么？

主 PHP 页面：

<div id="regcontainer">
    <iframe id="registration" src="register.html" frameborder="0" allowtransparency="true" scrolling="auto"></iframe>
</div>

JS文件中的JQUERY命令包含在主页中，淡出DIV：

var closeIFrame = function() { 
    $('#regcontainer').fadeOut("fast"); 
}

淡入：

$('#register').click(function() { $('#regcontainer').fadeIn("fast"); });

Answer 1

也许是这样的，这是一个小提琴

<a href="#" class="register-open">Register</a>

<div id="regcontainer">
  <iframe id="registration" src="http://fiddle.jshell.net/user/login/" frameborder="0" allowtransparency="true" scrolling="auto">
  </iframe>
  <a href="#" class="register-close">Close</a>
</div>


$(function() {

  $('.register-open').click(function() {
    $('#regcontainer').slideToggle(450);
  });
  $('.register-close').click(function() {
    $('#regcontainer').slideToggle(450 ); 
  });

});

Answer 2

如果 OK 按钮位于淡出的 div 内，则不能使用 fadeToggle()，因为之后您无法按下它。

我相信你正在寻找这样的东西：

HTML

<div id="regcontainer">
    <div class="button"></div>
</div>
<div class="button2"></div>

jQuery

$('.button').on('click', function() {
  $('#regcontainer').fadeOut('fast');
})

$('.button2').on('click', function() {
  $('#regcontainer').fadeIn('fast');
})

JSFiddle

Answer 3

您必须使用 fadeIn 方法。http://api.jquery.com/fadeIn/

var showIFrame = function() {
    $('#regcontainer').fadeIn("fast");
}

Answer 4

您应该使用fadeToggle()来使您的div切换状态。另外我认为你也可以使用fadeIn()，但由于你想让你的 div 同时出现和消失，fadeToggle()是最好的选择。

http://api.jquery.com/category/effects/fading/这应该提供您需要的所有信息