JQuery рассчитать значение идентификатора выбранной опции с дубликатами выбора

Question

Я даже не был уверен, как озаглавить это право.

У меня есть страница, на которой необходимо добавить общее количество множественных выборок и отображать общее количество при каждом изменении выбора. Все элементы выбора имеют одинаковые имена, а значения параметров указаны в идентификаторе параметра. Все, что я пробовал до сих пор, провалилось довольно ужасно. Благодарю.

пример:

    <select name="options">   
        <option ID="2.2" value="uid" selected>Option 1</option>
        <option ID="1.8" value="uid">Option 2</option>
        <option ID="3" value="uid">Option 3</option>
    </select>

    <select name="options">   
        <option ID="2.2" value="uid">Option 1</option>
        <option ID="1.8" value="uid" selected>Option 2</option>
        <option ID="3" value="uid">Option 3</option>
    </select>

    <div id="total">Total: 4</div>

Answer 1

Вот версия функции в jsFiddle:

http://jsfiddle.net/shaneblake/BBhnZ/

HTML:

<select name="options">           
    <option data-value="2.2" value="uid" selected>Option 1</option>
    <option data-value="1.8" value="uid">Option 2</option>        
    <option data-value="3" value="uid">Option 3</option>    
</select>    

<select name="options">           
    <option data-value="2.2" value="uid">Option 1</option>        
    <option data-value="1.8" value="uid" selected>Option 2</option>        
    <option data-value="3" value="uid">Option 3</option>    

</select>    

<div id="total">Total: 4</div>

JavaScript:

$(function() {
    $("select[name='options']").change(function() { updateTotal(); });
    updateTotal();
});

function updateTotal() {
    var newTotal = 0;
    $("select[name='options'] option:selected").each(function() {
        newTotal += parseFloat($(this).data('value'));
    });
    $("#total").text("Total: " + newTotal);
}

Answer 2

Вы могли бы сделать

var selects = $("select[name=options]");

selects.bind("change", recalculateSelectTotals);

function recalculateSelectTotals() {
    var total = 0;
    selects.find("option:selected").each(function () {
        total += Number(this.id);
    });
    $("#total").text("Total: " + total);
}

Однако вы должны использовать value для значений и сохранить идентификатор для идентификаторов. Два выбора с одинаковым именем также недопустимы в разметке.

Answer 3

1: идентификаторы не могут начинаться с цифр.
2: у вас не может быть нескольких элементов с одинаковым идентификатором
3: укажите классы или идентификаторы своего выбора, чтобы вы могли прочитать их значения $('#selectID').val()