[JavaScript][HTML]Informacja dla pustych elementów. Opcje

[Generic]

Witam. Mam divy, który każdy z nich ma identyczną nazwę klasy. Potrzebuję aby w divach w których nic się nie znajduje pojawiała się informacja że jest pusty. Poniżej zamieszczam kod w którym niestety coś zrobiłem nie tak ponieważ jak widać nie działa i brakuje mi już pomysłów. Czekam na pomoc i z góry dziękuję.

https://jsfiddle.net/hcq25nwh/

[Comandeer]

Podpowiem: $('.page').each. Resztę dopowie Ci manual jQuery

[slash^]

$('.page:empty').html( 'is empty')
I zadnych petli nie trzeba
https://jsfiddle.net/hcq25nwh/1/

Ten post edytował slash^ 23.12.2015, 20:46:42

[trueblue]

[HTML] pobierz, plaintext 
div.page:empty:before{
  content:'pusty';
}
[HTML] pobierz, plaintext 

[Comandeer]

@trueblue akurat ::before dla treści, która nie jest jedynie element prezentacji wizualnej, tak nie bardzo pasuje. Nie wiem czy jakieś AT nie ma z tym dodatkowo problemów.

Natomiast co do :empty - wciąż zapominam o niektórych nowościach z CSS3...

[Generic]

Dzięki za tak szybki odzew. Jest jeszcze jeden problem, który przedstawiłem w powyższym kodzie. Problem polega na tym że po wyczyszczeniu diva z elementów, które da się usunąć z danego diva nie pojawia się informacja że dany div stał się pusty.

https://jsfiddle.net/hcq25nwh/6/

Ten post edytował Generic 23.12.2015, 22:32:57

[Comandeer]

Po clicku na przycisk jeszcze raz odpal kod sprawdzający divy

[Generic]

Po clicku na przycisk jeszcze raz odpal kod sprawdzający divy

Działa. Jednak gdy w jednym z tych divów znajduje się inny div i po kliknięciu delete usuwa się to informacja o pustym divie nie wyświetla się. Czy coś przeoczyłem i coś nie zostało usunięte?

https://jsfiddle.net/hcq25nwh/12/

Ten post edytował Generic 24.12.2015, 00:51:50

[Comandeer]

Hmm... Spacje, znak nowej linii... Ten element musi być całkowicie pusty.

[Generic]

Hmm... Spacje, znak nowej linii... Ten element musi być całkowicie pusty.

Tak to jest to tylko czy można to jakoś obejść bo nie chciałbym żeby w kodzie było to wszystko pozlepiane ponieważ później nie będę wiedział co i jak?

[Comandeer]

Po prostu usunąć wszystko, co jest w rodzicu danego przycisku (button.parent.html('')).

[Generic]

Po prostu usunąć wszystko, co jest w rodzicu danego przycisku (button.parent.html('')).

Niestety nie działa: https://jsfiddle.net/hcq25nwh/15/

[Comandeer]

I wgl Cię nie zastanowiło, że linijkę wyżej w kodzie parent jest funkcją i działa?

BTW zamiast $('button') użyj $(this).

[Generic]

I wgl Cię nie zastanowiło, że linijkę wyżej w kodzie parent jest funkcją i działa?

BTW zamiast $('button') użyj $(this).

Trochę poczytałem i udało mi się zrobić aby sprawdzało mi to z pominięciem spacji dodając !$.trim. Oczywiście sprawdziłem to i działa, ale problem w tym że w moim przykładzie odnoszę się do klasy i narzuca ona dla wszystkich elementów informacje o tym że element jest pusty nawet gdy zawiera coś w sobie. Potrzebuje pomysłu jak zrobić aby pojawiała się informacja tylko dla pustych klas. Niestety nie mogę wykorzystać do tego konkretnych id bo nie wiem ile ich będzie i jakie będą nosić nazwy znam tylko ich klasę. Wiem tylko gdzie leży błąd $('.page').text jednak nie mam pomysłu jak to naprawić ponieważ nie mogę użyć this ponieważ nie jest on zdefiniowany.


https://jsfiddle.net/hcq25nwh/17/

Ten post edytował Generic 29.12.2015, 03:10:36

[Comandeer]

Poczytaj o $.fn.each

[Generic]

Poczytaj o $.fn.each

Dzięki, pomogło Mógłbyś mi jeszcze napisać dlaczego napis wyświetla się z pominięciem ustawień w css?

https://jsfiddle.net/hcq25nwh/22/

[koodo218]

Dzięki, pomogło Mógłbyś mi jeszcze napisać dlaczego napis wyświetla się z pominięciem ustawień w css?

https://jsfiddle.net/hcq25nwh/22/

Style css są ustawione dla akapitu, ty natomiast w zmiennej info przechowujesz jedynie tekst, nie znacznik.

Możesz to rozwiązać chociażby poprzez taką instrukcję:

[JAVASCRIPT] pobierz, plaintext 
var info = $('p').html();
info = "<p>"+info+"</p>";
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował koodo218 29.12.2015, 18:28:38

[Generic]

Style css są ustawione dla akapitu, ty natomiast w zmiennej info przechowujesz jedynie tekst, nie znacznik.

Możesz to rozwiązać chociażby poprzez taką instrukcję:

[JAVASCRIPT] pobierz, plaintext 
var info = $('p').html();
info = "<p>"+info+"</p>";
[JAVASCRIPT] pobierz, plaintext 

A jest jakiś sposób żeby połączyć te znaczniki tak aby znajdowały się razem w zmiennej? Bo jeśli nie to wystarczy w sumie dać "<p>"Informacja ktora chce"</p>" bez kombinowania.

[koodo218]

A jest jakiś sposób żeby połączyć te znaczniki tak aby znajdowały się razem w zmiennej? Bo jeśli nie to wystarczy w sumie dać "<p>"Informacja ktora chce"</p>" bez kombinowania.

Oprócz sposobu z #17 możesz też pozbyć się końcówki
var info = $('p').html();
wtedy w zmiennej masz tylko i wyłącznik znacznik p z tekstem, wraz z odziedziczonymi stylami (lokalnymi również).

[Generic]

Oprócz sposobu z #17 możesz też pozbyć się końcówki
var info = $('p').html();
wtedy w zmiennej masz tylko i wyłącznik znacznik p z tekstem, wraz z odziedziczonymi stylami (lokalnymi również).

działa, tylko czemu informacja wyświetla się tylko w jednym ostatnim przypadku?

https://jsfiddle.net/hcq25nwh/24/