Добавление общего количества проверенных кнопок радиосвязи

UPDATE

Если вы попробуете форму на этой ссылке http://jsfiddle.net/Matt_KP/BwmzQ/ скрипку и выберите верхнюю правую кнопку 40 фунтов стерлингов, затем просмотрите сумму заказа на внизу - 40 фунтов. Затем, если вы выберете 75 фунтов стерлингов, сумма заказов изменится до 75 фунтов стерлингов, а затем, если вы вернетесь и снова проверьте 40 фунтов стерлингов, сумма заказа составляет 75 фунтов стерлингов + 40 фунтов стерлингов, когда для переключателя, который проверяется, должно быть всего 40 фунтов.

UPDATE END

У меня есть раздел с радиокнопками, где можно выбрать только определенные переключатели, если выбраны другие. Так скажите, если пользователь выбрал одну радиокнопку, но затем выбрал другую, первая радиокарта перестанет быть выбрана, так как они не могут быть оба выбраны.

Также я использую настраиваемый атрибут в переключателях под названием data-price, который содержит значение каждого переключателя, который необходимо добавить к нему.

Проблема заключается в том, что пользователь выбирает кнопку "Радио", общее количество показов прекрасное, но если пользователь выбирает другую радиокнопку, которая не может выбрать предыдущую, она добавляет общее количество на предыдущий, где оно должно только добавлять радио Кнопки, которые проверяются. Это похоже на кэширование итогов, которые я думаю.

Это то, что я использую, чтобы суммировать проверенные кнопки радио:

<script type="text/javascript">
jQuery(document).ready(function($){
$('input:radio').change(function(){
var total = 0.0;
$('input:radio:checked').each(function(){
      total += parseFloat($(this).data('price'));
});
$('#total').val(total.toFixed(2));
});

})
</script>

ОТВЕТЫ

Ответ 1

Я думаю, что большинство ваших проблем можно обойти с помощью некоторого нового HTML....

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

Вот ограниченный пример (согласно нашей дискуссии в чате).

http://jsfiddle.net/CZpnD/ < - вот пример, из которого вы можете работать.

основные вещи, на которые нужно обратить внимание, - это то, как я использовал одно и то же имя радио для каждого "блока" параметров и как я просматриваю все параметры, когда одна опция изменена, чтобы получить новое общее (не самое эффективное, но это работает).

и для любви к лейблам использовать пете!

Ответ 2

HTML построен для этого.

<form name="myform">
    <input type="radio" name="foo" value="10" /> foo 
    <input type="radio" name="foo" value="30" /> bar 
</form>

Если вы даете радиокнопкам одинаковое имя, тогда можно выбрать только один.

Далее, когда вы получаете радиоэлемент, свойство .value представляет значение текущего переключаемого переключателя

var myform = document.forms.myform;

var radio = myform.elements.foo;
var price = radio.value;

Обратите внимание, что radio является RadioNodeList, который возвращается только elements[name]

Пример

Однако выясняется, что поддержка браузера RadioNodeList - это приложение, поэтому вам нужно сделать это вручную. Или используйте RadioNodeList polyfill

for (var i = 0, len = radio.length; i < len; i++) {
    var el = radio[i];
    if (el.checked) {
        var price = el.value;
        break;
    }
}