Mam formę, którą buduję i chciałbym mieć javascript, aby wybrać i manipulować wszystkimi polami znajdującymi się w nazwie tablicy:

<input type="text" name="location[street]" value required />
<input type="text" name="location[city]" value required />
<input type="text" name="location[zip]" value required />
<input type="text" name="location[state]" value required />

Jak mogę zbudować selektor dla JavaScript, aby przełączyć wszystkie elementy Disabled State?

JQuery jest możliwy, ale nie preferowany. Wolałbym metodę, która działałaby bez bibliotek - takich jak dokument.getElementsbyName ().

0
Phil M 13 sierpień 2014, 21:31

2 odpowiedzi

Najlepsza odpowiedź

Wierzę, że {x0}} nie ma obsługi Dla selektora, aby uzyskać element za pomocą atrybutu , jak jQuery byłby input[name^="location"] (Dokumenty). Więc spróbuj tego:

var els = document.querySelectorAll('input');

for (var i = 0; i < els.length; i++)
{
    if (els[i].name.indexOf("location") > -1)
    {
        els[i].disabled = true;
    }
}

Fiddle. Z przyjemnością usłyszę, że się mylę i jest sposób na robienie tego tylko za pomocą selektora.

W każdym razie możesz użyć kodu bardziej semantycznego, wyłączając tylko feenet, jeśli lubisz: Skrzypce.

AKTUALIZACJA

Aby wyłączyć wszystkie elementy textarea i select, po prostu zawierać te tagi na selektorze:

var els = document.querySelectorAll('input, textarea, select');

Skrzypce

2
DontVoteMeDown 13 sierpień 2014, 18:04

Alternatywa dla QuerySelector byłby GetelemnesByTagname

var i;
var inputs = document.getElementsByTagName("input");

for (i = 0; i < inputs.length; ++i) {
 var name =  inputs[i].getAttribute("name");
    if(name.indexOf("location") > -1)
    {
    inputs[i].disabled = true;
        console.log(name);

    }
}

Link do JSFiddle.

1
karthickj25 13 sierpień 2014, 17:47