0

Здравствуйте!

Ситуация следующая: Есть форма в которой указана цена и количество для заказа, в поле количества встроена функция для изменения цены в зависимости от количества:

<span style='font-size: 14px; text-decoration:line-through; color:red;margin-top: -10px;'>135.20 руб</span>
<span class='label label label-success' style='background-color: #24C90E;margin-top: 10px;font-size: 20px; margin-right:-70px;padding: 5px;'><span style='font-size: 15px;'>Цена:</span><span id='fck_prc'> 96.00 </span><span style='font-size: 15px;'>руб</span></span>

<form method='post' action='' class='jcart'>
        <input type='hidden' name='jcartToken' value='ddef2310847aa98aa2016567e8a1c1af' />
        <input type='hidden' name='my_item_id' value='59551' />
        <input type='hidden' name='my_item_name' value='Lexy 20 пена монтажная всесезонная' />
        <input type='hidden' id='prc_b' name='my_item_price' value='116.43' />
                    <div class='input-prepend input-append' style='margin-top: 10px;'>
                    <span class='add-on btn-primary'>Купить</span>
  <span class='add-on'>Кол-во:</span><input id='appendedPrependedInput' onclick='ChangePrice()'  name='my_item_qty' size='4' type='number' value='120' style='width:40px;'><span class='add-on'>шт.</span>
<input class='btn btn-success' type='submit' name='my_add_button' style='float:right;padding: 4px 4px 4px 6px;' value='В корзину'/>

</div></form></div></div>

А также имеется радиогруппа:

<div class='btn-group' data-toggle='buttons-radio' style='margin-left: 54.5%;'><button type='button' id='36' class='btn'><span class='label label-inverse'><small>до 36 шт.</small></span><br>116.43 руб.</button><button type='button' id='36120' class='btn'><span class='label label-inverse'><small>от 36 до 120 шт.</small></span><br>110.00 руб.</button><button type='button' id='120' class='btn'><span class='label label-inverse'><small>от 120 шт.</small></span><br>96.00 руб.</button>

</div>

Вот функция:

function ChangePrice(){

var temp_var = document.getElementById("appendedPrependedInput").value;
    if(temp_var > 35 & temp_var < 120)
    {

        document.getElementById("prc_b").value = '<? echo  $prc['price_2']; ?>';
        document.getElementById("fck_prc").innerHTML = '&nbsp;<? echo  $prc['price_2']; ?>&nbsp;';
        document.getElementById("36120").class = 'btn active btn-success';

    }else if(temp_var > 119)
    {

        document.getElementById("prc_b").value = '<? echo  $prc['price_3']; ?>';
        document.getElementById("fck_prc").innerHTML = '&nbsp;<? echo  $prc['price_3']; ?>&nbsp;';
        document.getElementById("120").class = 'btn active btn-success';

    }else if(temp_var < 36)
    {

        document.getElementById("prc_b").value = '<? echo  $prc['price']; ?>';
        document.getElementById("fck_prc").innerHTML = '&nbsp;<? echo  $prc['price']; ?>&nbsp;';
        document.getElementById("36").class = 'btn active btn-success';

    }

}

Вопрос: Не могу сообразить как сделать, чтобы при изменении количества и цены присваивать соответствующей радиокнопке в вышеуказанной радиогруппе класс 'btn active btn-success' чтобы показать действующую цену. Попытался реализовать(document.getElementById("36").class = 'btn active btn-success';), не работает, в чём дело не понимаю.

Реализовано тут: http://yarfeliks.ru/tytan_view.php?id=2

И если знаете подскажите как сделать, чтобы изменение цены происходило "налету" - при воде количества, а то изменения происходят только по мере нажатия на клавиши уменьшения и увилечения, а Mozilla их не отображает.

5
  • 1
    el.className = "...";
    – RubaXa
    29 июл 2013 в 20:43
  • "радиокнопка"...... 29 июл 2013 в 20:50
  • @RubaXa, можно по подробнее а то не догоняю...
    – cheh1
    30 июл 2013 в 7:17
  • 1
    Например document.getElementById("36").class = "..." и document.getElementById("36").className = "...", почитайте тут: learn.javascript.ru/styles-and-classes
    – RubaXa
    30 июл 2013 в 7:32
  • @RubaXa, Спасибо! А по поводу того, чтобы изменение цены происходило "налету" - при воде количества, а то изменения происходят только по мере нажатия на клавиши уменьшения и увилечения, а Mozilla их не отображает.
    – cheh1
    30 июл 2013 в 19:20

1 ответ 1

3

Замените:

document.getElementById("...").class = ...';

На:

document.getElementById("...").className = ...';

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.