Как прикрутить onchange к radio?

Ссылка скопирована
1 ответ

Есть вот такой вот скрипт:

<script type="text/javascript"> function ChangePrice(option_id, priceplus) { priceplus = priceplus.split(":"); old_id = priceplus[0]; priceplus = priceplus[1]; price = document.getElementById("hprice").value; old_val = document.getElementById("oldg"+option_id).value; document.getElementById("oldg"+option_id).value = priceplus; delta = parseFloat(priceplus)-parseFloat(old_val); price = parseFloat(price)+delta; document.getElementById("vprice").innerHTML = price; document.getElementById("hprice").value = price; document.getElementById('hidid['+option_id+']').value = old_id; } function checkboxsum(vlu) { price = document.getElementById("hprice").value; priceplus = vlu.id; if(vlu.checked) price = parseFloat(price)+parseFloat(priceplus); else price = parseFloat(price)-parseFloat(priceplus); document.getElementById("vprice").innerHTML = price; document.getElementById("hprice").value = price; } </script>

<script type="text/javascript"> function ChangePrice(option_id, priceplus) { priceplus = priceplus.split(":"); old_id = priceplus[0]; priceplus = priceplus[1]; price = document.getElementById("hprice").value; old_val = document.getElementById("oldg"+option_id).value; document.getElementById("oldg"+option_id).value = priceplus; delta = parseFloat(priceplus)-parseFloat(old_val); price = parseFloat(price)+delta; document.getElementById("vprice").innerHTML = price; document.getElementById("hprice").value = price; document.getElementById('hidid['+option_id+']').value = old_id; } function checkboxsum(vlu) { price = document.getElementById("hprice").value; priceplus = vlu.id; if(vlu.checked) price = parseFloat(price)+parseFloat(priceplus); else price = parseFloat(price)-parseFloat(priceplus); document.getElementById("vprice").innerHTML = price; document.getElementById("hprice").value = price; } </script>

Предназначен для динамического изменения цены в интернет-магазине, при выборе посетителем аттрибута товара, у которого есть наценка. Скрипт уже работает с аттрибутами, имеющими тип select. А вот как научить его работать с аттрибутами типа radio?

Код для select выглядит вот так:

<!-- select -->  <table class="calc" border="0" cellspacing="0" cellpadding="5" bgcolor="#f3d6b1"> 			<tr class="{cycle values="calc1,calc2"}"> 				<td width="220px"> 				<p><strong>{$options_data.NAME}:</strong></p> 				</td> 				<td> 				<p> <select id="hidid[{$options_data.ID}]" name="id[{$options_data.ID}]" style="display:none;"> {foreach key=key_data item=item_data from=$options_data.DATA} <option value="{$item_data.ID}">{$item_data.TEXT}   {if $item_data.MODEL}({$item_data.MODEL}){/if} {if $item_data.PRICE_PLAIN != 0}({$item_data.PREFIX}{$item_data.PRICE}){/if}</option> {/foreach} </select>  <select name="idvis[{$options_data.ID}]" onchange="Javascript:ChangePrice({$options_data.ID},this.value);"> {foreach key=key_data item=item_data from=$options_data.DATA}   {if $item_data.PREFIX == '-'}     <option value="{$item_data.ID}:{$item_data.PRICE_PLAIN}">{$item_data.TEXT}   {if $item_data.MODEL}({$item_data.MODEL}){/if} {if $item_data.PRICE_PLAIN != 0}({$item_data.PRICE}){/if}</option>   {else}     <option value="{$item_data.ID}:{$item_data.PREFIX}{$item_data.PRICE_PLAIN}">{$item_data.TEXT}   {if $item_data.MODEL}({$item_data.MODEL}){/if} {if $item_data.PRICE_PLAIN != 0}({$item_data.PREFIX}{$item_data.PRICE}){/if}</option>   {/if} {/foreach} </select> <input type="hidden" name="oldg{$options_data.ID}" id="oldg{$options_data.ID}" value="0" /> </p> 				</td> 			</tr> 		</table> <!-- /select -->

<!-- select --> <table class="calc" border="0" cellspacing="0" cellpadding="5" bgcolor="#f3d6b1"> <tr class="{cycle values="calc1,calc2"}"> <td width="220px"> <p><strong>{$options_data.NAME}:</strong></p> </td> <td> <p> <select id="hidid[{$options_data.ID}]" name="id[{$options_data.ID}]" style="display:none;"> {foreach key=key_data item=item_data from=$options_data.DATA} <option value="{$item_data.ID}">{$item_data.TEXT} {if $item_data.MODEL}({$item_data.MODEL}){/if} {if $item_data.PRICE_PLAIN != 0}({$item_data.PREFIX}{$item_data.PRICE}){/if}</option> {/foreach} </select> <select name="idvis[{$options_data.ID}]" onchange="Javascript:ChangePrice({$options_data.ID},this.value);"> {foreach key=key_data item=item_data from=$options_data.DATA} {if $item_data.PREFIX == '-'} <option value="{$item_data.ID}:{$item_data.PRICE_PLAIN}">{$item_data.TEXT} {if $item_data.MODEL}({$item_data.MODEL}){/if} {if $item_data.PRICE_PLAIN != 0}({$item_data.PRICE}){/if}</option> {else} <option value="{$item_data.ID}:{$item_data.PREFIX}{$item_data.PRICE_PLAIN}">{$item_data.TEXT} {if $item_data.MODEL}({$item_data.MODEL}){/if} {if $item_data.PRICE_PLAIN != 0}({$item_data.PREFIX}{$item_data.PRICE}){/if}</option> {/if} {/foreach} </select> <input type="hidden" name="oldg{$options_data.ID}" id="oldg{$options_data.ID}" value="0" /> </p> </td> </tr> </table> <!-- /select -->

Дополнительно:

Ну если добавить еще один селект, то ничего работать не будет.
ни одной радиокноки в коде нет
https://developer.mozilla.org/ru/docs/Web/HTML/Ele...

  • Froggyweb, код, который для radio такой:
    <!-- radio --> <p> <strong>{$options_data.NAME}:</strong> {foreach key=key_data item=item_data from=$options_data.DATA} <!-- changed by mosq // --> <input type="radio" name="id[{$options_data.ID}]" value="{$item_data.ID}" {$item_data.CHECKED} /> {$item_data.TEXT} {if $item_data.PRICE_PLAIN != 0}({$item_data.PREFIX}{$item_data.PRICE}){/if} {if $item_data.DESCRIPTION}<br />{$item_data.DESCRIPTION}<br />{/if} {if $item_data.SHORT_DESCRIPTION}{$item_data.SHORT_DESCRIPTION}<br />{/if} {if $item_data.IMAGE}<img src="{$image_dir}thumbs/{$item_data.IMAGE}" border="0" alt="{$item_data.TEXT}" />{/if} {if $item_data.LINK}<a align="right" href="http://{$item_data.LINK}" target="_blank"><img src="{$tpl_path}img/info.gif" border="0" alt="{$item_data.TEXT}" /></a>{/if}<br /> {/foreach} </p> <!-- /radio -->

    <!-- radio --> <p> <strong>{$options_data.NAME}:</strong> {foreach key=key_data item=item_data from=$options_data.DATA} <!-- changed by mosq // --> <input type="radio" name="id[{$options_data.ID}]" value="{$item_data.ID}" {$item_data.CHECKED} /> {$item_data.TEXT} {if $item_data.PRICE_PLAIN != 0}({$item_data.PREFIX}{$item_data.PRICE}){/if} {if $item_data.DESCRIPTION}<br />{$item_data.DESCRIPTION}<br />{/if} {if $item_data.SHORT_DESCRIPTION}{$item_data.SHORT_DESCRIPTION}<br />{/if} {if $item_data.IMAGE}<img src="{$image_dir}thumbs/{$item_data.IMAGE}" border="0" alt="{$item_data.TEXT}" />{/if} {if $item_data.LINK}<a align="right" href="http://{$item_data.LINK}" target="_blank"><img src="{$tpl_path}img/info.gif" border="0" alt="{$item_data.TEXT}" /></a>{/if}<br /> {/foreach} </p> <!-- /radio -->

    И вот его нужно изменить так, чтобы он работал подобно коду select

  • Алексей, https://developer.mozilla.org/en-US/docs/Web/HTML/...
    не очень понимаю в чем проблема.
  • Нужно решить такую задачу?

    Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

    Заказать помощь
    Лучший ответ
    1
    Павел Админов Ответ

    Для того чтобы прикрутить событие onchange к радио кнопкам, вам необходимо использовать JavaScript. Событие onchange срабатывает, когда значение элемента было изменено.

    Пример кода на JavaScript, который добавляет событие onchange к радио кнопкам:

    document.addEventListener('DOMContentLoaded', function() {
        var radios = document.querySelectorAll('input[type="radio"]');
     
        radios.forEach(function(radio) {
            radio.addEventListener('change', function() {
                // Ваш код, который будет выполнен при изменении значения радио кнопки
            });
        });
    });

    document.addEventListener('DOMContentLoaded', function() { var radios = document.querySelectorAll('input[type="radio"]'); radios.forEach(function(radio) { radio.addEventListener('change', function() { // Ваш код, который будет выполнен при изменении значения радио кнопки }); }); });

    В этом примере мы используем метод document.querySelectorAll() для выбора всех радио кнопок на странице. Затем мы добавляем событие onchange к каждой радио кнопке с помощью метода addEventListener(). Внутри обработчика события onchange вы можете добавить любой код, который должен быть выполнен при изменении значения радио кнопки.

    Не забудьте поместить этот скрипт внутри тега в вашем HTML документе, чтобы он корректно работал.

    Другие ответы (0)

    Пока нет других ответов. Будьте первым, кто поможет автору.

    Ответить на вопрос

    комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *

    Вам также может быть интересно