Значения сумм флажков

Question

У меня есть флажки с ярлыками вроде 1 some text Я хотел бы получить номер из меток отмеченных флажков и добавить их вместе. Я пытался сделать что-то вроде того, что у меня внизу, но это ничего мне не дает.

var total = 0; 

$('input:checked').each(function() { 
    total += parseInt($("label[for='" + this.id + "']").text()); 
}); 

Ниже приведен пример CheckBox

<label><input type="checkbox" id="enbapicks-1" name="ENBApicks[1]" value="1" checked> 1 Golden State</label> 
<label><input type="checkbox" id="enbapicks-5" name="ENBApicks[5]" value="1" checked> 5 Memphis</label> 

Answer 1

Ваш label не имеет for атрибут, поэтому $("label[for='" + this.id + "']") возвращает пустой, и, таким образом, .text() возвращается пустая строка.

Вы должны указать это так:

<input type="checkbox" id="enbapicks-1" name="ENBApicks[1]" value="1" checked> 
<label for="enbapicks-1">1 Golden State</label> 

Если вы не можете изменить HTML, вы могли бы получить от labelinput с parent() методом:

<label><input type="checkbox" value="1" checked>1 Golden State</label> 

$('input').parent().text() // "1 Golden State" 

В качестве альтернативы можно установить номер в качестве атрибута inputvalue, затем используйте метод val(), чтобы захватить его от input элементов.

<input type="checkbox" value="3"> 

$('input').val() // "3" 

Пока вы можете, всегда указывать for атрибут для конструктивных элементов label.

Answer 2

Как я упоминал в комментарии. Вы должны хранить данные куда более логичным. Одним из вариантов было бы значение для флажка другой является как data attribute, как показано ниже

$(document).ready(function(){ 
 
//Set a handler to catch clicking the check box 
 
    $("#boxes input[type='checkbox']").click(function(){ 
 
    var total=0; 
 
    //lOOP THROUGH CHECKED 
 
    $("#boxes input[type='checkbox']:checked").each(function(){ 
 
     //Update total 
 
      total += parseInt($(this).data("exval"),10); 
 
    }); 
 
    $("#result").text(total); 
 
    }); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="boxes"> 
 
<label><input type="checkbox" id="enbapicks-1" name="ENBApicks[1]" value="1" data-exval="1"> 1 Golden State</label> 
 
<label><input type="checkbox" id="enbapicks-5" name="ENBApicks[5]" value="1" data-exval="5"> 5 Memphis</label> 
 
<label><input type="checkbox" id="enbapicks-7" name="ENBApicks[7]" value="1" data-exval="7"> 7 Who Knows</label> 
 
    </div> 
 
<div>Result: <span id="result"></span></div>