Deaktivieren Sie alle anderen TDs in einer Reihe, wenn das erste TD ausgewählt ist

Question

Ich habe eine Tabelle, die mehrere Zeilen enthält. Jede Zeile enthält 5 Spalten (oder 5 TDs). Im ersten TD befinden sich ein Textfeld und ein Auswahlfeld. Die 4 anderen TDs enthalten jeweils eine Tabelle, die eine Gruppe von Optionsfeldern enthält.

  0
  1

            1B
            FO

Im Grunde möchte ich, dass die Optionsfelder in den restlichen 4 TDs deaktiviert sind, es sei denn, der Benutzer gibt einen Wert in das Textfeld ein ODER wählt einen Wert im Auswahlfeld aus.

Ich habe daran gedacht, jeder TR-Klasse hinzuzufügen, dann irgendwie jeden TD zu durchlaufen, der nicht der erste TD ist, und das disabled-Attribut zu entfernen (um es zu aktivieren), aber ich kann nicht verstehen, wie ich die bedingte Anweisung erstelle oder ob ich Parents() oder Siblings() oder etwas anderes verwenden muss zum Durchqueren.

Schnelle Klarstellung: Meine Tabelle hat mehrere Zeilen und mehrere Spalten (ich habe nur 2 der TDs gezeigt, um Platz zu sparen, aber die anderen 3 TDs sehen genauso aus wie der 2.). Zum Beispiel werden player1 und p1name1 player2 und p2name2 in der zweiten Zeile sein. Wenn also der Text/Auswahl im ERSTEN Zeile geändert wird, sollte dies nicht alle Optionsfelder in ALLEN Zeilen aktivieren - nur die Optionsfelder in der ERSTEN Zeile.

Jede Hilfe wird geschätzt!

Answer 1

$('input:radio').attr('disabled', true);

$('select[name=player1], input[name=p1name]').change(function(){
   $('input:radio').attr('disabled', false);
});

Ich würde empfehlen, Attribute in Anführungszeichen zu setzen, wie name="p1name" statt name=p1name. Verrückte Dinge können passieren, wenn du es nicht tust.

Wenn du Elementen IDs oder Klassen gibst, kannst du genauer festlegen, welche Elemente ausgewählt werden und welche nicht. Nehmen wir zum Beispiel an, du möchtest nur einen der Radio-Buttons deaktivieren, dann könntest du das leicht tun. Ohne die ID ist es viel schwieriger.

Wie gewünscht:

vergeben Sie den Selects und Inputs eine Klasse, wie

und du kannst so darauf zugreifen:

$('.affector').change(function(){
   $(this).parents('tr').find('input:radio').attr('disabled', false);
});

Wenn du mehr Radio-Buttons irgendwo im haben würdest und nur eine bestimmte Gruppe aktivieren möchtest, wären Klassen wieder von Vorteil. Du könntest den Klassen-Selektor für den "input:radio" im .find() verwenden und nur diese würden betroffen sein.

Zusatz:

Wenn sie die einzigen Selects und Text-Inputs auf der Seite sind, könntest du auch auf das Hinzufügen von Klassen verzichten und stattdessen Typ-Selektoren verwenden:

$('select, input:text').change(function(){
   $(this).parents('tr').find('input:radio').attr('disabled', false);
});

Answer 2

Sie könnten ein DIV um diese TDs herum platzieren, das Sie mit JavaScript ausblenden können. Eine Suche bei Google wird Ihnen helfen, wie man DIVs ausblendet :). Viel Glück!