Показать сообщение отдельно
  #10 (permalink)  
Старый 06.11.2019, 13:00
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Я на JQ, чтобы короче:

<form method="POST" action="send.php" id="order">
        <label>Размер: </label>
        <select name="size" required>
            <option value="" disabled selected>Выбрать</option>
            <option value="1">10x10</option>
            <option value="2">20x20</option>
            <option value="3">30x30</option>
        </select><br />
        <label>Тип: </label>
        <select name="type" required>
            <option value="" disabled selected>Выбрать</option>
            <option data-price="[100,200,300]" value="1">Тип 1</option>
            <option data-price="[150,250,350]" value="2">Тип 2</option>
            <option data-price="[200,300,400]" value="3">Тип 3</option>
        </select><br />
        <label>рамка: </label>
        <select name="frame">
            <option value="">Выбрать</option>
            <option data-price="[100,200,300]" value="1">Рамка 1</option>
            <option data-price="[150,250,350]" value="2">Рамка 2</option>
            <option data-price="[200,300,400]" value="3">Рамка 3</option>
        </select><br />
        <label>упаковка: </label>
        <select name="packing">
            <option value="">Выбрать</option>
            <option data-price="[100,200,300]" value="1">Красная</option>
            <option data-price="[150,250,350]" value="2">Синяя</option>
            <option data-price="[200,300,400]" value="3">Зеленая</option>
        </select><br />
	
        Итого: <output name="total"></output><br />
        <input type="submit" value="Заказать">
    </form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$('#order').on('change', 'select', function(e) {
    var f = e.delegateTarget, p = $('select', f), size = p.eq(0).children(':selected').index()-1, v = 0;
    
    if(!p.filter(function() {
        return this.required && !this.value    
    }).length) {
        $.each(p.slice(1), function() {
            v += this.value ? $(this).children(':selected').data('price')[size] : 0
        });
        f.total.value = v;
    }
});
</script>


Правильно считает?

Последний раз редактировалось laimas, 07.11.2019 в 17:58.
Ответить с цитированием