Как переделать js, чтобы не воспринималось двойное нажатие на radio кнопку
Здравствуйте. Есть вот такой код https://jsfiddle.net/dfybvwoh/10/ . В начале через select задаётся цена товара товара, а потом через radio кнопки добавляется 2000 или цена остаётся прежней. Этот код рабочий, но мне он не подходит. В своём сайте я использую jquery form styler, и с помощью его я модифицирую внешний вид input'ов, а именно input type="radio". Загвоздка в том, что используя этот form styler можно выбрать один и тот же radio несколько раз. 1 раз нажал на radio - получил 500, еще раз нажал - получил 1000, и так далее. Помогите пожалуйста переделать код так, чтобы этого бага не было. То есть нажатие на radio не приводило к повторному прибавлению.
|
drkrol,
if ($( this ).val() == "notime" & time_plus == true) :blink: |
drkrol,
опишите все комбинации вычисления цены |
Где двойное срабатывание? Не вижу. У меня все нормально работает на jsfiddle.net.
|
Цитата:
Цитата:
|
рони,
В начале через select, где 8 option (типы), а потом через радио кнопку. Больше ценообразования нет. |
калькулятор стилизация при помощи jQuery Form Styler
drkrol,
варианты цены это строки 22 - 29 ... <!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.formstyler/1.7.6/jquery.formstyler.css"> <script src="https://cdn.jsdelivr.net/jquery.formstyler/1.7.6/jquery.formstyler.min.js"></script> <script> $(function() { var inp = $('input[name="time"]'), sel = $('select[name="type"]'), items = $().add(inp).add(sel), price = $(".price"); items.styler().on("change", function() { var t = sel[0].selectedIndex, r = inp.index(inp.filter(":checked")); price.val({ 1: { 0: 2500, 1: 500 }, 2: { 0: 2800, 1: 800 } }[t][r] || 0) }) }); </script> </head> <body> <select name="type" class="type"> <option ></option> <option>Тип1</option> <option>Тип2</option> </select> <p></p> <label> <input type="radio" name="time" value="yestime" class="rrad"> <div class="rtext">Трубы горят</div> </label> <label> <input type="radio" name="time" value="notime" class="rrad"> <div class="rtext">Время есть</div> </label> <input type="text" class="price" value="0" readonly> </body> </html> |
рони,
Извини, не хочу создавать новую тему. Ты бы не мог подсказать,как сделать так, чтобы после того, как будет выбран select и radio выполнялось действие: $('.priceblock').removeClass('none'); ? |
Цитата:
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> .none{ display: none; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.formstyler/1.7.6/jquery.formstyler.css"> <script src="https://cdn.jsdelivr.net/jquery.formstyler/1.7.6/jquery.formstyler.min.js"></script> <script> $(function() { var inp = $('input[name="time"]'), sel = $('select[name="type"]'), items = $().add(inp).add(sel), price = $(".price"), block = $('.priceblock'); items.styler().on("change", function() { var t = sel[0].selectedIndex, r = inp.index(inp.filter(":checked")), num = { 1: { 0: 2500, 1: 500 }, 2: { 0: 2800, 1: 800 } }[t][r] || 0; price.val(num); num && block.removeClass('none') }) }); </script> </head> <body> <select name="type" class="type"> <option ></option> <option>Тип1</option> <option>Тип2</option> </select> <p></p> <label> <input type="radio" name="time" value="yestime" class="rrad"> <div class="rtext">Трубы горят</div> </label> <label> <input type="radio" name="time" value="notime" class="rrad"> <div class="rtext">Время есть</div> </label> <input type="text" class="price" value="0" readonly> <div class="priceblock none">скрытый блок</div> </body> </html> |
Часовой пояс GMT +3, время: 06:07. |