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

Сообщение от MC-XOBAHCK
не всё мне в коде понятно
О логике кода я писал много, а по конкретике, это почитать о функциях jQuery. Что не понятно?

Сообщение от MC-XOBAHCK
При вводе размеров будь то в миллиметрах или метрах - в результате я хотел бы иметь метры квадратные
Тоже не проблема. Я не буду приводить html код, только JS. Так как выводит квадраты как '²' или '.кв', это для любых единиц измерения, то данную опцию внесем из объектов массива dim в переменную sqr. Свойство mul этих объектов теперь будет выполнять иную роль - корректировать рассчитанные площади до метров кв.

Добавим единицами измерения и сантиметры. Это исключительно для примера, и можно не применять, думаю понятно будет как. Когда было две единицы, то было просто, а если три, то нужно запоминать текущие единицы, чтобы корректно преобразовывать значения в полях для выбранных единиц. Запоминание текущих единиц в переменную dir производится в момент нажатия мыши на копки выбора единиц (значения выбранной кнопки). В время смены единиц из запомненных единиц и выбранных формируется строка, по которой как свойству объекта mul получается множитель на который производится коррекция значений в полях ввода.

Код кнопок управления такой:

<label><input type="radio" name="unit" value="0" checked="" /> метры</label>
<label><input type="radio" name="unit" value="1" /> сантиметры</label>
<label><input type="radio" name="unit" value="2" /> миллиметры</label>


Расчеты прямоугольников, треугольников и ... вынесены в функции.

function rectangle(a, b) {
    return a * b
}

function triangle(a, b) {
    return a * b * .5
}

function trapeze(a, b, c) {
    return (a + b) * c * .5
}

function calculate(g, v) {
    var a, b;
    switch(g) {
        case 'rectangle': a = rectangle(v[0], v[1]), b = rectangle(v[2], v[3]);
                          return [a, b, a && b ? (a + b) * 2 : 0];
                          break;
        case 'triangle':  a = triangle(v[0], v[1]), b = trapeze(v[2], v[3], v[4]);
                          return [a, b, a && b ? (a + b) * 2 : 0];
                          break;
        case 'pyramid':   a = triangle(v[0], v[1]), b = triangle(v[0], v[2]);
                          return [a, b, rectangle(v[1], v[2]), a && b ? (a + b) * 2 : 0];                    
    }   
}

$(function() {
    var dir, //предыдущее состояние единиц измерения
        sqr = '²', //символ кдаратных значений
        mul = { //множетели единиц измерения для полей ввода в зависимости от предыдущего и нового состояния
            '01': 100,
            '12': 10,
            '02': 1000,
            '10': .01,
            '21': .1,
            '20': .001    
        },
        dim = [{unt: 'м', dec: 2, mul: 1}, {unt: 'см', dec: 0, mul: .0001}, {unt: 'мм', dec: 0, mul: .000001}],
        side = $('input:text')
        .on('keyup', function() {
            this.value = this.value.replace(/[,\.]+/,'.').replace(/[^\d.]/,'');
            
            var u = unit.filter(':checked').val();
            
            //расчет площадей для всех заполненных полей
            $('[data-area]').each(function() {
                //группу определяет атрибут data-area    
                var group = $(this).data('area'),
                    values = $.map(side.filter('.'+group), function(e) {
                        var v = parseFloat(e.value);
                        return v || 0
                    }),
                    area = calculate(group, values);
                
                $(this).find('.area').each(function(i, e) {
                    $(e).text(
                        //вывод площадей в метрах
                        area[i] ? (area[i] * dim[u].mul).toFixed(2) + ' м' + sqr : ''   
                    )
                })
            })
    }), 
    unit = $('input:radio')
        .change(function() {
            var u = this.value, //выбранные единицы измерения 
            d = dir + u; //множитель единиц в зависимоти от прежнего их состояния
            $('.unit').text(dim[u].unt); 
            side.val(function() {
                var v = parseFloat(this.value); 
                if(v) return (v * mul[d]).toFixed(dim[u].dec) 
            }).trigger('keyup');
    })
    .parent() //получить родителей - label
    .mousedown(function() { //запомнить текущие единицы измерения при нажатии мыши на label
        dir = unit.filter(':checked').val()
    }).end(); //вернуться к кнопкам radio 
});


Интересная комната, на крышу похожа. Может быть для такой конфигурации иметь высоту до конька и высоты для сторон рассчитывать, а не вводить для каждой? Ведь "на глазок" ввести значение чтобы все срослось не трудно ли будет?

Последний раз редактировалось laimas, 13.08.2017 в 19:49.
Ответить с цитированием