Voici mon HTML:
<div class="large">
<img src="/images/photos/Interior.jpg" alt="The interior" style="[...]" />
<div class="caption">The interior</div>
</div>
<div class="small">
<img src="/images/photos/Bedroom.jpg" alt="Bedroom" style="[A different ...]" />
<div class="caption">A bedroom</div>
</div>
3 Réponses :
$(document).ready(function() {
$('div.small').click(function() {
var bigHtml = $('div.large').html();
var smallHtml = $(this).html();
$('div.large').html(smallHtml);
$('div.small').html(bigHtml);
//custom functions?
});
});
Merci pour l'aide. Quelqu'un sache pourquoi je perds vos lampes en collant cela dans Visual Studio?
Cela fonctionne bien, mais vous perdez des événements liés à la DIV (comme "ControlName.Changer ()". L'utilisation de détachis et d'appends conserve les événements. Voir
Changez votre balisage un peu: puis dans le JavaScript, vous pouvez faire: évidemment, il peut être nettoyé , mais vous avez l'idée.
Changer à ID n'est pas une option, car il y a plus d'un div.small
function swapContent(){
var tempContent = $("div.large").html();
$("div.large").empty().html($("div.small").html());
$("div.small").empty().html(tempContent);
}
<div class="large">
<img src="/images/photos/Interior.jpg" alt="The interior" style="[...]" />
<div class="caption">The interior</div>
</div>
<div class="small" onclick="swapContent()">
<img src="/images/photos/Bedroom.jpg" alt="Bedroom" style="[A different ...]" />
<div class="caption">A bedroom</div>
</div>
Hope it helps.
Lol rofl, etc. !! Je viens de me trouver à la recherche d'un bon moyen d'échanger les contenus de div en utilisant jQuery. Et regarder qui a répondu à cette question .....