За последние 24 часа нас посетили 21764 программиста и 1021 робот. Сейчас ищут 704 программиста ...

Дата тайм пикер, для собственных нужд.

Тема в разделе "JavaScript и AJAX", создана пользователем Artur_hopf, 24 янв 2019.

  1. Artur_hopf

    Artur_hopf Активный пользователь

    С нами с:
    7 май 2018
    Сообщения:
    2.266
    Симпатии:
    405
    Добрый день, пришлось начать писать простенький тайм пикер. Подскажите что желательно исправить. Только начал, внешний вид формируется так:
    Код (Javascript):
    1. (function() {
    2. var dateTimePicker = document.getElementById('dateTimePicker'),
    3.    body1 = '',
    4.    optionMinute = '',
    5.    optionHour = '',
    6.    optionDay = '',
    7.    optionMonth = '',
    8.    optionYear = '',
    9.    now = new Date(),
    10.    year = "" + now.getFullYear(),
    11.    month = "" + (now.getMonth() + 1),
    12.    day = "" + now.getDate(),
    13.    hour = "" + now.getHours(),
    14.    minute = "" + now.getMinutes();
    15.  
    16. var name = ['Минуты', 'Часы', 'Дата', 'Месяц', 'Год'];
    17.  
    18. for (var i = 0; i < 60; i++) {
    19.     if(i !== 0 && i <= 12){
    20.          optionMonth += '<option value="'+i+'">'+i+'</option>';
    21.      }
    22.      if(i <= 23){
    23.          optionHour += '<option value="'+i+'">'+i+'</option>';
    24.      }
    25.      if(i !== 0 && i <= 31){
    26.           optionDay += '<option value="'+i+'">'+i+'</option>';
    27.      }
    28.       optionMinute += '<option value="'+i+'">'+i+'</option>';
    29. }
    30.  
    31. for (var i = 2019; i <= 2050; i++) {
    32.      year += '<option value="'+i+'">'+i+'</option>';
    33. }
    34.  
    35. var optionTime = [optionMinute, optionHour, optionDay, optionMonth, optionYear],
    36.      nowTime = [minute, hour, day, month, year];
    37.  
    38.  
    39. var head = '<div class="container">'
    40.      +'<div class="row">'
    41.     +'<div class="col-2 nopadding">'
    42.     +'<br><div>Начало неполадки</div><br><div>Окончание неполадки</div>'
    43.     +'</div>';
    44.  
    45. var footer = '</div></div>';
    46. for (var i = 0; i < 5; i++) {
    47.     body1 += '<div class="col-2 nopadding">'
    48.    +'<div>'+name[i]+'</div><br><div>'
    49.    +'<select class=" selectAdjustStopFault-center" id="selectData'+i+'">'
    50.     +'<option value="'+i+'">'+ nowTime[i] +'</option>'
    51.     + optionTime[i]
    52.      + '</select></div></div>';
    53. }
    54. dateTimePicker.innerHTML = head + body1 + footer;
    55.  
    56. })();
    Мне чем проще тем лучше, пойдет что ли, или говнокод?
     
  2. villiwalla

    villiwalla Активный пользователь

    С нами с:
    14 дек 2016
    Сообщения:
    471
    Симпатии:
    70
    Дата и часы дублируются, если нужно отметить их уже при рендере то есть атрибут для option selected. Зачем вообще брать кол-во часов в сутках и зачем брать кол-во месяцев если они неизменны? HTML не так много, но я бы лучше использовал .createElement. Вот пример накидал: http://jsfiddle.net/ut0y9dfj/1/
     
    Artur_hopf нравится это.
  3. Artur_hopf

    Artur_hopf Активный пользователь

    С нами с:
    7 май 2018
    Сообщения:
    2.266
    Симпатии:
    405
    @villiwalla спасибо, завтра переделаю :)