• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Lista to do, przycisk delete.

VPS Starter Arubacloud
0 głosów
237 wizyt
pytanie zadane 17 września 2017 w JavaScript przez Vorex444 Dyskutant (9,610 p.)
zamknięte 17 września 2017 przez Vorex444

Na filmie przedstawiłem z czym jest problem

https://www.youtube.com/watch?v=01-EhMofi3k&feature=youtu.be

Chce aby kazdy przycisk odpowiadal za swojego diva, a w tej chwili działa tylko jeden, ten pierwszy, tak jak widać na filmie.

KOD:

 <div class="container">
            <h1>List To Do</h1>
            <form>
                <input id="input" type="text" placeholder="Napisz coś" required>
                <input type="submit" value="Add" id="add">
            </form>
            <div class="list" id="list">
                <div class="list-item">
                    <p>Dziś wieczorem, zrobić zakupy.</p><button id="delete">DELETE</button>
                </div>
            </div>
        </div>

 

 

window.onload = function()
{
    var add = document.getElementById('add');
    var input = document.getElementById('input');
    var list = document.getElementById('list');
    var deleteItem = document.getElementById('delete');
    
    add.addEventListener('click', function(e)
    {
        var textContent = input.value;
        e.preventDefault();
        if(input.value == '')
            {
                alert('Wpisz coś!');
            }
        else
            {
                var item = document.createElement('div');
                item.setAttribute('class', 'list-item');
                item.innerHTML = "<p>" + textContent + "</p>"
                + "<button id='delete'>" + "DELETE" + "</button>";
                list.appendChild(item);
            }
    });
    
    deleteItem.addEventListener('click', function(e)
    {
        e.preventDefault();
        this.parentNode.remove();
    });
};  

 

komentarz zamknięcia: problem rozwiazany
komentarz 17 września 2017 przez cyklop123 Bywalec (2,790 p.)
może spróbuj coś napisać samemu

xD
komentarz 17 września 2017 przez Vorex444 Dyskutant (9,610 p.)
no caly czas próbuje i szukam odpowiedzi na google, ale nie idzie
komentarz 17 września 2017 przez cyklop123 Bywalec (2,790 p.)

po pierwsze to jak dodawałbym przycisk w liście to tworzyłbym to tak jak tworzysz diva

po drugie to musisz użyć słówka kluczowego this

i metod removeChild oraz parentChild

komentarz 17 września 2017 przez Vorex444 Dyskutant (9,610 p.)
jak probuje dodac tak button, to mi wywala to [object HTMLButtonElement]
komentarz 17 września 2017 przez cyklop123 Bywalec (2,790 p.)
a to błąd ?
komentarz 17 września 2017 przez Vorex444 Dyskutant (9,610 p.)
juz ogarnalem

2 odpowiedzi

0 głosów
odpowiedź 17 września 2017 przez Programista31 Użytkownik (640 p.)
wybrane 17 września 2017 przez Vorex444
 
Najlepsza
Podaj link do strony to ci pomogę.
komentarz 17 września 2017 przez Vorex444 Dyskutant (9,610 p.)
komentarz 17 września 2017 przez Vorex444 Dyskutant (9,610 p.)
jacie, chyba juz wszystko próbowałem, nawet tak jak kolega wyzej pisal, znalazlem nawet podobny przyklad i tez nie chcialo zadzialac o dziwo :D XD
komentarz 17 września 2017 przez Tomasz90 Nałogowiec (25,140 p.)
komentarz 17 września 2017 przez Vorex444 Dyskutant (9,610 p.)
dzięki wielkie! Oczywiscie nie zrobie to w ten sposob ze ctrl c -> v, tylko przejże to i zobacze jak to zrobiles aby wiedziec next razem jak to robic, dzięki!
komentarz 17 września 2017 przez cyklop123 Bywalec (2,790 p.)
0 głosów
odpowiedź 17 września 2017 przez Tomasz90 Nałogowiec (25,140 p.)
Problem jest taki, że to na górze skryptu masz tą zmienną deleteItem, która w momencie wczytania skryptu zawiera jeden element. Potem do tego elementu przypisujesz zdarzenie (do jednego). Pozostałe elementy jakie tworzysz nie są powiązane ze zdarzeniem kliknięcia.

Musiałbyś mieć albo funkcję do usuwania na onclicku dla tworzonego elementu lub to zdarzenie co napisałeś zrobić dla całego dokumentu, a to co masz w środku ograniczyć do elementów które mają id nazwane 'delete'. Ogólnie to każdy element powinien mieć unikalne id.

Podobne pytania

0 głosów
1 odpowiedź 1,507 wizyt
pytanie zadane 24 stycznia 2019 w JavaScript przez kryst.4 Początkujący (350 p.)
0 głosów
2 odpowiedzi 471 wizyt
pytanie zadane 11 września 2017 w JavaScript przez svyatogor92 Użytkownik (670 p.)
+1 głos
3 odpowiedzi 288 wizyt

92,454 zapytań

141,262 odpowiedzi

319,089 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...