I have this script:
$('#ap').click(function() {
$('#content-container').html($('#alertpay').html());
re开发者_JAVA技巧turn false;
});
Whenever someone clicks on #ap
, it will show the contents of #alertpay
in #content-container
.
However, how am I able to make a return link, so when users click it, it will show the original content from #content-container
? (The contents that were there.)
UPDATE I am trying with this code:
<div align="center" id="content-container">
<a href="#" id="ap">Show #alertpay</a>
</div>
<div id="alertpay" style="display:none">
#alertpay content here.
<a href="#" id="return-link">RETURN</a>
</div>
(function(){
var cchtml;
$('#ap').click(function(){
cchtml = $('#content-container').html();
$('#content-container').html($('#alertpay').html());
return false;
});
$('#return-link').click(function(){
$('#content-container').html(cchtml);
return false;
});
})();
The thing that does not work here, is when I press the RETURN anchor link. It doesn't do anything.
Best option is to have three containers. Initially One empty. Based on the user behaviour chose the content to display.
$('#ap').click(function() {
$('#empty-container').html($('#alertpay').html());
return false;
});
$('#revert-ap').click(function() {
$('#empty-container').html($('#content-container').html());
return false;
});
And make sure you hide content-container and alertpay
(function(){
var cchtml;
$('#ap').click(function(){
cchtml = $('#content-container').html();
$('#content-container').html($('#alertpay').html());
return false;
});
$('#return-link').click)function(){
$('#content-container').html(cchtml);
return false;
});
})();
you can use .data
for example if you have the following markup
<div id="alertpay">
asd
</div>
<div id="content-container">
hello
</div>
<a href="#" id="ap">change</a>
<a href="#" id="restore">restore</a>
and the jquery
$original='';
$('#ap').click(function() {
if($original.length==0){
$('#content-container').data('original', $('#content-container').html());
$original=$('#content-container').data('original');
}
$('#content-container').html($('#alertpay').html());
return false;
});
$('#restore').click(function() {
$('#content-container').html( $('#content-container').data('original'));
return false;
});
here is the fiddle http://jsfiddle.net/YUGCq/3/
精彩评论