通過fadeIn/fadeOut切換元素

我試圖讓下面的代碼行淡出窗體的類「.quote」，並將其替換爲類「.thanks」的DIV。當按鈕被點擊時。它只在點擊輸入區域時才起作用，但不會消失div.thanks。通過fadeIn/fadeOut切換元素

<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插入。

來源

2011-03-30 Sleek Geek

我覺得這是你與你的想法找什麼...

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

來源

2011-03-30 18:36:37 mattsven

@ Dz1：您試圖添加稱爲「評論」而不是「編輯」的內容。相反，請使用「添加評論」進行評論。 – BoltClock 2011-03-30 19:37:29

BoltClock感謝您的更正 – 2011-03-31 15:32:34

您需要使用CSS將兩個元素放置在同一位置。通常這涉及使用position：absolute和setting left：right：CSS樣式。一旦設置正確，你可以像你期望的那樣使用jQuery的fadeIn和fadeOut。

來源

2011-03-30 18:35:21

NexxeuS我把它改爲$（文件）。就緒（函數（）{$ （「報價」）。點擊（函數（）{$ （本）.fadeOut（5000）; \t $（「謝謝。」）淡入（6000）; }）; }）;現在它工作。但我希望它在單擊按鈕時工作，而不是輸入字段。我也希望它得到vistor的名字，並將其插入.thanks DIV – 2011-03-30 19:21:38

通過fadeIn/fadeOut切換元素

回答

相關問題