Pomoc s jQuery – detach()

[kidnecParticipant Web]

Ahoj,
potřeboval bych poradit se skrýváním obsahu pomoci detach.

mám pár elementů, které chci pomocí checkboxu schovat. moje js funkce vlastně vezme value z chcekboxu, která je shodná s třídou, která se má schovat. Však jsem stále nepřišel na to, jak zajistit i obrácený efekt, tedy po zpětném zaškrtnutí třídu znovu na stejném místě zobrazit. Dopracoval jsem se do výsledku, kde element pouze skryji, to mi však poté nesedělo css, které je vázané na odd/even child element. Zde je js. Pokud by byla potřeba ukázka zbytku mohu doposlat. Předem díky.

$(document).ready(function(){
  $('input[type="checkbox"]').click(function(){
    $($(this).val()).detach();
  });
});

[adminKeymaster Web]

Dobrý příklad máte přímo v manuálu pro .detach(). Můžete použít .append() či .appendTo().

[kidnecParticipant Web]

bohužel jsem nedokázal vytvořit to co potřebuji. Například tento kód dělá to co potřebuji, tedy check box určuje, zda je prvek s určitou třídou zobrazen.

	$('input[type="checkbox"]').change(function() {
			
		
  if ($(this).is(':checked')) {
     $($(this).val()).show();
  } else {
 $($(this).val()).hide();
  } 
  
  
}); 

až na to, že poté nesedí css na even/odd prvky. appent a appento to může zpětně vkládat, však tato fnkce ve výsledku pracuje s několika prvky, tedy kompletně programovat nějaké zapamatování pozice apod by bylo na dýl…. to radši udělám nějaké tlačítko reset, které opět načte kompletní stránku a tím se prvky znovu načtou, bohužel bez předešlé filtrace

[kidnecParticipant Web]

Tak si denně vytvářím chvilku na mou výuku jquery. prozatím jsem se dostal sem. tedy

k elementům si přídám třídy s čísly, abych při zpětném nahrání měl možnost se dopracovat k jejich původní pozici.

2.) každý element co se má schovat se nejdříve v podobě čistého html nahraje do proměnné, ideálně do pole jako promenná[class_elementu][index_elementu]. Kdy index vlastně čísluje počet elementů s danou třídou na stránce

3.) se elementy můžou prakticky odstranit z DOM

4.) při opětovném kliknutí na checkbox, se přečte pole promenná[class_elementu] a každá položka se podle třídy nahraje za/před

$(document).ready(function(){
	

        $(".as-time article").each(function(i) {
			
        $(this).addClass("as-time-item-" + (i+1));
		
        });

 

	$('input[type="checkbox"]').change(function() {
		
		var obname = $(this).val();
		
		
  if ($(this).is(':checked')) {	  
     console.log('Zobrazit ' + obname);
 

  } else {

   
	 $(obname).each(function( index ) {  
	 
	 
console.log('INDEX:'+ index);
console.log('HTML:' + $( this )[0].outerHTML);

console.log('class:' + $( this ).attr('class'));

console.log($( this ));
	
});
	 
	 
  $(obname).remove(); 
	

  
  } 

   
  console.log('---------------------------------------------------');
}); 
	

});

bod 4 jestě není na pořadu, bod 3 mám a u bodu dva mi chybí vytvoření pole. Také přemýšlím zda zachovat do proměnné celé objekty, nebo pouze to co potřebuji, tedy čisté HTML

[adminKeymaster Web]

@kidnec: Je možné někde přímo online vidět zdrojové HTML (klidně neveřejně)? Nějak si to celé neumím moc představit…

[kidnecParticipant Web]

Odkaz na příklad

[Autor]

Příspěvky