2016-04-01 4 views
0

ich in einer Tabelle einige Check geprüft werden Boxen haben, wie unten dargestellt:Funktion ausführen, wenn ein von vielen Kontrollkästchen

<table id="checkBoxTable" class="uk-margin-small-top uk-hidden checkBoxTable" style="width:100%"> 
     <tr> 
      <td><label id="1"><input name="1" type="checkbox"> 12am-1am</label</td> 
      <td><label id="2"><input name="2" type="checkbox"> 1am-2am</label</td> 
      <td><label id="3"><input name="3" type="checkbox"> 2am-3am</label></td> 
      <td><label id="4"><input name="4" type="checkbox"> 3am-4am</labe</td> 
     </tr> 
    </table> 

ich eine Funktion ausgeführt werden soll, wenn eine der Kontrollkästchen aktiviert ist. Ich habe versucht, die folgenden:

$('#checkBoxTable').change(function(){ 
     var price = 10 * originalPrice; 
     $('#price').value = price + ""; 

    }); 
+1

'if ($ ('# checkBoxTable: Checkbox: checked') Länge.)' – Rayon

Antwort

0

Ziel Checkbox input [type = "checkbox"]

$('#checkBoxTable input[type="checkbox"]').change(function(){ 
    var price = 10 * originalPrice; 
    $('#price').value = price + ""; 
}); 
0

Sie #checkBoxTable sind die Auswahl, die id der Tabelle ist. Sie sollten #checkBoxTable :checkbox verwenden, um checkbox Elemente auszuwählen.

$('#checkBoxTable :checkbox:checked' wird checked Eingabeelemente zurückgeben.

var originalPrice = 100; 
 
$('#checkBoxTable :checkbox').change(function() { 
 
    if ($('#checkBoxTable :checkbox:checked').length) { 
 
    var price = 10 * originalPrice; 
 
    alert(price); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table id="checkBoxTable" class="uk-margin-small-top uk-hidden checkBoxTable" style="width:100%"> 
 
    <tr> 
 
    <td> 
 
     <label id="1"> 
 
     <input name="1" type="checkbox">12am-1am</label> 
 
    </td> 
 
    <td> 
 
     <label id="2"> 
 
     <input name="2" type="checkbox">1am-2am</label> 
 
    </td> 
 
    <td> 
 
     <label id="3"> 
 
     <input name="3" type="checkbox">2am-3am</label> 
 
    </td> 
 
    <td> 
 
     <label id="4"> 
 
     <input name="4" type="checkbox">3am-4am</label> 
 
    </td> 
 
    </tr> 
 
</table>

Fiddle demo