Форум

рони · #11 (**permalink**) 14.12.2015, 10:12

Deymos,

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>

<input type="number" id="width" value="1.1"/>
<input type="number" id="price" value="500"/><input type="number" id="price" value="333"/>
<button name="len" value="1">1m</button>
<button name="len" value="2">2m</button>
<button name="len" value="2.5">2,5m</button>
<hr/>
<span id="result">0</span>

<script>
!function() {
    var result = document.getElementById('result'),
        width = document.getElementById('width'),
        price = document.querySelectorAll('#price')[1];
    document.body.onclick = function(event) {
        var target = event.target;
        if(target.name == 'len') {
            result.innerHTML = target.value * price.value * width.value;
        }
    }
}();
</script>

</body>
</html>

Deymos · #12 (**permalink**) 14.12.2015, 10:33

...и видимо последний шаг. Второй #price появляется при выборе 3 параметров. Если я правильно понимаю, мне нужно выполнить body on click. Я внес правку, но JS не получает значение.

jQuery("body").on("click",".single_variation_wrap",function() {
    var result = document.getElementById('result'),
        width = document.getElementById('width'),
        price = document.querySelectorAll('#price')[1];
    document.body.onclick = function(event) {
        var target = event.target;
        if(target.name == 'len') {
            result.innerHTML = target.value * price.value * width.value;
        }
    }
})();

рони · #13 (**permalink**) 14.12.2015, 10:46

Deymos,
вам сложно помочь

Deymos · #14 (**permalink**) 14.12.2015, 10:50

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

Deymos · #15 (**permalink**) 14.12.2015, 14:39

Ребят, у меня реализованы кнопки по вашему примеру, как input мне поменять на select?

<input name="len" value="1.5" type="button">
<input name="len" value="1.8" type="button">
<input name="len" value="2.0" type="button">
<input name="len" value="2.5" type="button">
<input name="len" value="3.0" type="button">
<input name="len" value="3.5" type="button">
<input name="len" value="4.0" type="button">
<input name="len" value="6.0" type="button">

EmperioAf · #16 (**permalink**) 14.12.2015, 17:20

Возможно вы имели ввиду это

Deymos · #17 (**permalink**) 15.12.2015, 06:19

я имел ввиду это:
<select>
<option name="len" value="1.5">1.5</option>
...
<option name="len" value="6.0">6.0</option>
</select>

что бы значение в коде выше менялось. На данный момент если заменить существующую конструкцию и сделать выбор - ничего не меняется.
Решил вопрос:

<select name="len" >
<option value="1.5">1.5</option>
...
<option value="6.0">6.0</option>
</select>

Форум

Справочник

Discord чат

Курсы javascript