2016-03-21 6 views
1

Ich habe ein Skript, das einen Wert zeigt, wenn ein Kontrollkästchen aktiviert ist und zeigt keinen Wert, wenn mehr als ein Kontrollkästchen aktiviert ist.jQuery: mehrere Kontrollkästchen, erhalten den Wert des einzigen überprüften

Dies funktioniert zu einem bestimmten Zeitpunkt. Wenn ich ein Kontrollkästchen anwähle, bekomme ich den zugehörigen Wert class=list, wenn ich ein zweites Kästchen anklicke, bekomme ich nichts und das ist richtig.

Wenn ich jedoch das zweite Kontrollkästchen deaktiviere, zeigt der Alarm seinen Wert an, nicht den Wert des letzten verbleibenden Kontrollkästchens.

Also, wie bekomme ich den Wert der einzigen Checkbox?

Dies ist das Layout der Checkbox und es ist am nächsten class list

<tr> 
<td>1</td><td><input type='checkbox' name='id[0]' id='0'/></td> 
<td class='list'><span>1234</span></td> 
<td><span></span></td> 
</tr> 

Dies ist die jQuery Ich verwende:

$(document).ready(function() { 
    var count; 
    $(':checkbox').change(function() { 
     count = ($('input[type="checkbox"]:checked').length) ; 
     txt = $(this).closest('tr').find('.list').text(); 
     if (count == "1") { 
      alert (txt) 
     } 
    }); 
}); 

Hier ist ein JSFiddle zeigt das Problem: http://jsfiddle.net/f7qcuwkf/ Wenn Sie Option 1 überprüfen Die Warnung zeigt 1234.

Wenn Sie Option 3 aktivieren, wird nichts angezeigt (dies ist korrekt). Wenn Sie die Option deaktivieren Bei beiden Optionen sehen Sie den Wert und nicht den Wert des verbleibenden eingecheckten Eintrags. EG ::

Uncheck 3 I erhalten 3456, NOT 1234 (1 wird noch geprüft)

Irgendwelche Ideen, wie dieses Problem zu lösen?

Dank

+1

Natürlich, wenn Sie das DOM mit 'this' durchqueren, werden Sie die vaue der geänderten Checkbox erhalten. Sie müssen das DOM mit der Checkbox durchlaufen: http://jsfiddle.net/f7qcuwkf/2/ –

+0

@ Karl-André Gagnon danke für die schnelle Antwort. Wenn du dies als Antwort postest, akzeptiere ich es. – JeffVader

Antwort

1

Wenn Sie das DOM mit this durchqueren, werden Sie die vaue der geänderten Checkbox erhalten. Sie müssen das DOM mit dem aktivierten Kontrollkästchen durchlaufen. Dazu können Sie die ausgewählten Kontrollkästchen zwischenspeichern und das DOM damit durchlaufen.

$(document).ready(function() { 
    var count; 
    $(':checkbox').change(function() { 
     var $checkboxes = $('input[type="checkbox"]:checked'); 
     count = ($checkboxes.length) ; 

     if (count == "1") { 
      var txt = $checkboxes.closest('tr').find('.list').text(); 
      alert (txt) 
     } 
    }); 
}); 

http://jsfiddle.net/f7qcuwkf/5/

+0

Danke das funktioniert super :) – JeffVader

0

Sie benötigen txt Variable auf diese Weise (für die nächste Zeile zu dem geprüft Checkbox, und nicht auf das schauen, die geändert wurde) zuweisen:

txt = $('input[type="checkbox"]:checked').closest('tr').find('.list').text(); 

Demo

0

Wenn Sie Änderungen vornehmen, fangen Sie den Text aus dem aktivierten Kontrollkästchen und nicht aus dem aktivierten Kontrollkästchen ab.

$(":checkbox:checked").closest("tr").find('.list').text()

http://jsfiddle.net/f7qcuwkf/1/

Verwandte Themen