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

Przekazanie parametru

Aruba Cloud VPS - 50% taniej przez 3 miesiące!
0 głosów
255 wizyt
pytanie zadane 14 sierpnia 2019 w JavaScript przez michal_php Stary wyjadacz (13,700 p.)

Cześć.

Mam problem aby przekazać parametr funkcji do document.querySelector.Chodzi o wartość take do pola id.

Nie za bardzo wiem jak to można zapisać aby tą wartość poprawnie odczytał.

let variable = document.querySelector('textarea[id="'+take+'"]');

 

2 odpowiedzi

+1 głos
odpowiedź 14 sierpnia 2019 przez pablop76 VIP (123,460 p.)
edycja 14 sierpnia 2019 przez pablop76

Jeżeli tag ma id to pobierz go po id.

 const variable = document.getElementById(id);

 

komentarz 14 sierpnia 2019 przez michal_php Stary wyjadacz (13,700 p.)

Jak daje tak to wywala mi błędy :

generator.js:420 Uncaught TypeError: Cannot read property 'value' of null
    at validateTextareaMixture (generator.js:420)
    at HTMLTextAreaElement.onkeydown

a zrobiłem tak:

 let variable = document.getElementById(take);

Bo to dla elementu  textarea

komentarz 14 sierpnia 2019 przez pablop76 VIP (123,460 p.)
Pokaż więcej kodu.
komentarz 14 sierpnia 2019 przez michal_php Stary wyjadacz (13,700 p.)
<textarea id="mixture_safety_helpInfo" name="mixture[safety][helpInfo]" maxlength="250" class="Textera-mixture form-control" onkeydown="validateTextareaMixture(mixture_safety_helpInfo)">Brak informacji.</textarea>

Kod JS:

function validateTextareaMixture(take) {
   // let variable = document.querySelector(`textarea[id=${take}]`);
    let variable = document.getElementById(take);
    console.log(variable.value.length);
}

 

komentarz 14 sierpnia 2019 przez Mati Gaduła (3,390 p.)
Funkcja jest dobra. Według błędu, który podałes wyżej wyszukuje textarea, ale takie textarea o podanym id nie znajduje(nie istnieje) i zwraca null stąd ten błąd w konsoli.
komentarz 14 sierpnia 2019 przez michal_php Stary wyjadacz (13,700 p.)
A co robię źle ,że zwraca null ? co mogę zmienić ?
komentarz 14 sierpnia 2019 przez Mati Gaduła (3,390 p.)

Przekazujesz takie id w parametrze elementu, który na pewno istnieje w strukturze DOM?

 

Możesz to zabezpieczyć:


function validateTextareaMixture(take) {
   // let variable = document.querySelector(`textarea[id=${take}]`);
    let variable = document.getElementById(take);
    if(variable) {
      console.log(variable.value.length);
    }
}

 

komentarz 14 sierpnia 2019 przez michal_php Stary wyjadacz (13,700 p.)
Co masz na myśli ,że na pewno istnieje w strukturze dom ?
komentarz 14 sierpnia 2019 przez Mati Gaduła (3,390 p.)

Czy istnieje textarea o podanym id w parametrze funkcji. Załóżmy mamy taki przypadek

<textarea id="content"></textarea>

1. Wywoałanie funkcji validateTextareaMixture('content');

2. let variable = document.getElementById('content');

3. console.log(variable) -> zwraca nam  //<textarea id="content"></textarea>;

W przypadku, gdy podasz błędne id i nie znajduje go w strukturze strony to zwraca Ci null.

W jaki sposób masz dodawane pola, które sprawdzasz za pomocą tej funkcji, są na sztywno wpisane w pliku html, czy dynamicznie? 

komentarz 14 sierpnia 2019 przez michal_php Stary wyjadacz (13,700 p.)

Działa zrobiłem jeszcze prościej :

function validateTextareaMixture(take) {

    console.log(take.value.length);
}

i zlicza długość znaków 

komentarz 14 sierpnia 2019 przez ScriptyChris Mędrzec (190,190 p.)

@michal_php, proponuję precyzyjniej umieszczać kod w console.log lub debugować stan aplikacji jeśli coś nie działa lub działa inaczej niż oczekujesz. W podanym przykładzie (wyciąłem zbędne atrybuty z HTML, żeby kod był bardziej przejrzysty):

<textarea id="mixture_safety_helpInfo" onkeydown="validateTextareaMixture(mixture_safety_helpInfo)">Brak informacji.</textarea>

do funkcji validateTextareaMixture przekazujesz globalną zmienną mixture_safety_helpInfo (nie string), która - przez specyficzne zachowanie DOM - przechowuje obiekt DOM <textarea>. Zatem wewnątrz funkcji validateTextareaMixture:

function validateTextareaMixture(take) {
    let variable = document.getElementById(take);
    console.log(variable.value.length);
}

zmienna take jest już obiektem DOM, a nie ID jak się spodziewasz. Stąd metoda document.getElementById zwraca null. Dlatego, jak napisałeś w poprzednim komentarzu, kod: console.log(take.value.length); prawidłowo wyświetla długość znaków, bo operujesz na gotowym obiekcie DOM - nie musisz go pobierać. Czytelniej by było, gdybyś przekazał do funkcji this:

<textarea id="mixture_safety_helpInfo" onkeydown="validateTextareaMixture(this)">Brak informacji.</textarea>

A jeszcze lepiej opędzić to na addEventListener.

0 głosów
odpowiedź 14 sierpnia 2019 przez Mati Gaduła (3,390 p.)
edycja 14 sierpnia 2019 przez Mati

Aby przekazać parametr tym sposobem co ty musi to wyglądać tak i parametr musi być stringiem.

let variable = document.querySelector('textarea[id='+take+']');


Możesz też skorzystać z wersji es6 i znaków ``

let variable = document.querySelector(`textarea[id=${take}]`);

 

Przykład: https://jsfiddle.net/d2u1k84n/ (O takie coś Ci chodziło?)

Podobne pytania

0 głosów
0 odpowiedzi 600 wizyt
pytanie zadane 5 marca 2022 w JavaScript przez Us Użytkownik (880 p.)
0 głosów
0 odpowiedzi 487 wizyt
+1 głos
3 odpowiedzi 200 wizyt
pytanie zadane 22 czerwca 2021 w JavaScript przez ITshnyk Obywatel (1,800 p.)

93,103 zapytań

142,077 odpowiedzi

321,563 komentarzy

62,445 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

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...