jQuery mehrere Radiobuttons

Question

New Javascript / jquery und eine harte Zeit, mit der Verwendung von "this" oder "$ (this)" das aktuelle Objekt zu erhalten.

Ich habe eine Tabelle mit einer Reihe von Optionsfeldern in jeder Zeile, jeder dem Namen ‚s_‘. Keiner der Radio-Buttons sind standardmäßig aktiviert:

<tr>
   <td align="left" style="width: 300px">
      <div id="div_s_0">
         <input type="radio" name="s_0" value="1" />Public
         <input type="radio" name="s_0" value="2" />Not Public
         <input type="radio" name="s_0" value="3" />Confidential
      </div>
   </td>
</tr>
<tr>
   <td align="left" style="width: 300px">
      <div id="div_s_1">
         <input type="radio" name="s_1" value="1" />Public
         <input type="radio" name="s_1" value="2" />Not Public
         <input type="radio" name="s_1" value="3" />Confidential
      </div>
   </td>
</tr>

Ich versuche, eine jQuery-Funktion zu schreiben, eine neue Zeile in die Tabelle hinzuzufügen, wenn der Benutzer ein Optionsfeld wählt, aber nur, wenn sie zur Zeit in der letzten Zeile der Tabelle sind. Was ich möchte, ist zu tun, um das Namensattribut des Radiobutton geklickt erhalten, analysieren sie den Zeilenindex (das heißt der Teil nach dem ‚_‘) zu bekommen, und vergleichen Sie es mit der Anzahl der Zeilen in der Tabelle. Wenn sie gleich sind, fügen Sie eine neue Zeile, sonst nichts tun.

Meine Frage ist zweifach, je nachdem, wie ich diese angreifen soll:

1) Wie kehre ich den Namen Attribut eines Optionsfeld, OR 2) Wie kehre ich den Zeilenindex der Zeile Ich bin derzeit in?

Answer 1

Dies wird Ihnen den Index erhalten, mit dem HTML Sie zur Verfügung gestellt haben:

$(document).ready(function() {
    $("input:radio").click(function() {
        var index = parseInt(this.name.split('_')[1])
    });
});

Eine andere Sache, die Ihnen helfen können: die Anzahl der Zeilen in der Tabelle abrufen:

$($("table").children()[0]).children().length

Hope this Sie auf Ihrem Weg hilft.

Answer 2

Für Ihre speziellen Fragen 1 & 2, wenn Sie gab dem Tisch eine ID von „mytable“, dieses Beispiel sollten Sie geben, was Sie suchen:

var rowIndex = $("#mytable tr").index($(this).parents("tr"));
var inputName = $(this).attr("name");
alert("Input Name: " + inputName + "; RowIndex: " + rowIndex);

Answer 3

Hier einige ungetesteten Code, aus der Spitze von meinem Kopf:

$("#div_s_0 input[type='radio']").onclick = function() {
    if ($("#div_s_0 input[type='radio']:last").attr('checked') == 'checked') {
    /* add a new element */
    }
}

Was das tut, ist ein Onclick-Ereignis zu jedem der Optionsfelder in der div befestigen. Die Onclick wird überprüfen, ob das letzte Optionsfeld in der Gruppe aktiviert ist, und wenn ja, ein weiteres Element hinzuzufügen.

Wie gesagt ist es noch nicht getestet. Ich bin nicht sicher über den Selektor (#div_s_0 ... :last) es so geben einen Lauf in Firebug zuerst.