Question

我正在尝试使用下面的代码行fadeOut带有“.quote”类的表单，并将其替换为具有“.thanks”类的DIV。单击按钮时。它仅在您单击输入区域但不淡化div.thanks时才有效。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){
  $(".quote, .thanks").click(function(){
    $('form:fadeIn(:.thanks)').fadeOut (5000);
  }); 

});

</script>

<style type="text/css">
<!--
.thanks {
    display: hide;
}
-->
</style>
</head>

<body>
<form action="" method="get" id="quote" class="quote">
  <p>
    <label>
      <input type="text" name="name" id="name" />
    </label>
  </p>
  <p>
    <label>
      <input type="submit" name="button" id="button" value="Submit" />
    </label>
  </p>
</form>
<div class="thanks">Thanks for contacting us, we'll get back to you as soon as posible</div><!-- End thanks -->

我还想知道如何获取访问者的姓名并将其插入div.thanks。

Answer 1

我认为这就是你要找的......

$(".quote").click(function(){
    $(this).fadeOut(5000, function(){
        $(".thanks").fadeIn();
    });
});

Answer 2

您需要使用CSS将两个元素放在同一位置。通常，这涉及使用position：absolute和left left：和right：CSS样式。一旦设置正确，您可以按预期使用jQuery的fadeIn和fadeOut。

元素由fadeIn / fadeOut切换

2 个答案: