Блог

Главная - Вопросы по программированию - функция с регистром переключения не дает выходных данных

функция с регистром переключения не дает выходных данных

#javascript #jquery #html #css

#javascript #jquery #HTML #css

Вопрос:

У меня есть функция, которая получает дату и должна возвращать знак в соответствии с датой. например, если один из входных данных равен 15.4.1996

вывод будет Aries

Я проверяю только день и месяц (год не измеряется), но проблема в том, что, к сожалению, я не получаю никаких выходных данных. почему?

 function yourSign() {
    var signDate = $("input[name='birthDate']").val();
    switch (signDate) {

        case 0:
            outputSign = "Aries"

            var dateFrom = "21/03";
            var dateTo = "20/04";

            var dateFrom = dateFrom.split("/");
            var dateTo = dateTo.split("/");

            var from = new Date(d1[2], parseInt(d1[1]) - 1); // -1 because months are from 0 to 11
            var to = new Date(d2[2], parseInt(d2[1]) - 1);
            signDate = new Date(c[2], parseInt(c[1]) - 1);

            var signOutput = console.log(signDate > from amp;amp; signDate < to)
            $("#output").val(signOutput);

            //  document.getElementsByName('output')[0].value = signOutput;
    }
}  
 <head>
   <meta charset="utf-8" />
   <title>your sign</title>
   <link rel="stylesheet">
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
   <div>
   <form id="yourSign">
      <label for=birthDate>birthdate</label><br /><input type="date" name="birthDate" id="birthDate" /><br />
      <button onclick="yourSign()" id="sendSign" name="sendSign">send</button><br>
      <label for="output" id="output">your sign is: </label><br><input type="text" name="output">
   </form>

Комментарии:

1. signDate > from amp;amp; SignDate < to опечатка, чувствительность к регистру — ваша среда IDE должна увидеть это для вас, если вы правильно ее настроили

2. Возвращаемое значение будет строкой, но вы сравниваете с числом. Попробуйте использовать "0" .

3. это birthDate не Birthdate

4. @ladyd Откуда d1 d2 и c откуда? Или это тоже опечатки?

5. Этот код повсюду. Проверьте все имена переменных на орфографию (с учетом регистра!) и обязательно инициализируйте каждое из них, но только один раз!

Ответ №1:

В вашем коде много проблем, которые необходимо исправить :

Строка 3 : 

 switch (signDate) {
        case 0:

=> Зачем вам переключать регистр поверх строкового представления даты? Когда он должен быть оценен в 0?

Строки 8-12 : 

     var dateFrom = "21/03";
    var dateTo = "20/04";

    var dateFrom = dateFrom.split("/");
    var dateTo = dateTo.split("/");

=> Вы объявляете dateFrom и dateTo как строку, а затем повторно объявляете их как массивы (результат split() функции). Вам следует избегать этого, это немного сбивает с толку. И я предполагаю, что из следующих строк вы хотели назвать свои массивы d1 и d2 .

Строки 14-16 : 

    var from = new Date(d1[2], parseInt(d1[1]) - 1); // -1 because months are from 0 to 11
   var to = new Date(d2[2], parseInt(d2[1]) - 1);
   signDate = new Date(c[2], parseInt(c[1]) - 1);

=> c d1 и d2 не определены. Я предполагаю d1 , что и d2 являются результатом разделения строки даты (см. Выше). Но что насчет c ?

Строка 18 : 

 var signOutput = console.log(signDate > from amp;amp; signDate < to)

=> Вы устанавливаете возвращаемое значение console.log() в переменную signOutput . console.log выводит данные на консоль и возвращает undefined .

Ответ №2:

«функция с регистром переключения не дает выходных данных»

Это проблема XY. OP должен подходить к этой проблеме, зная определенные факты:

  • Пользовательский ввод имеет два диапазона: месяц: от 1 до 12 чисел и дни: от 1 до 31 числа. API даты и / или <input type="date"> является сложным, и год не требуется. Требуется только 2 числа от пользователя.

  • A <form> и его элементы управления формой (например <input> , <select> , <button> , и т.д.) Могут использоваться для ограничения пользовательского ввода, поэтому функции могут быть написаны так, чтобы ожидать определенного ввода и всегда ожидать, что они будут выдавать одни и те же результаты. работая с данными из <input type="date"> одного, необходимо учитывать, создан ли его экземпляр для объекта или нет, форматирование и т. Д. Вместо этого попробуйте a в <select> течение нескольких месяцев и <input type="number"> дней.

  • jQuery загружен, поэтому необходимо учитывать определенные вещи. Никогда не используйте атрибут on-event. Обработка событий jQuery универсальна и мощна, поэтому воспользуйтесь ее преимуществами.

    👎 <button onclick="fnc();" type="button">Done</button>

    👍 <button type="button">Done</button> ...
    ... $('button').on('click', fnc);

  • JavaScript свободно типизирован, поэтому всегда помните о том, какие аргументы находятся от одной строки к следующей. Попробуйте сосредоточиться на одном типе во всей функции. Пользователь предоставил только 2 числа, поэтому после преобразования из строки в действительные числа сохраняйте их такими, пока результаты не будут отображены пользователю.

A switch() полезно, если нужно обрабатывать несколько возможностей аналогичным и ограниченным образом. Используйте if if...else else операторы //, если разрешение условия приводит к дальнейшим условиям. Вот схема switch() , представленная в демонстрации:

  • Передается одно число: от 0 до 11 — номер индекса из <select> представляющего case MONTH: .

  • Ссылка на одно число: от 1 до 31 — число из <input type="number"> числа, представляющего DAY .

      case MONTH:
   SIGN = DAY < Specific_day ? "sign A" : "signB";
   break;

  • Троичный:
    если DAY число меньше, чем [<] Specific_day Число, то [?] …
    SIGN Строка равна [=] "sign A" String …
    else [:]
    SIGN Строка равна [=] "sign B" String

Функция maxDays() регулирует ввод, гарантируя, что значение input#day maximum является правильным в соответствии с месяцем и что оно никогда не превышает минимального значения 1 и максимального значения 30, 29 или 31.

 $('#month, #day').on('input', maxDays);
$('button').on('click', zSign);

function maxDays() {
  var num = Number($(this).val());
  var max;

  if ($(this).is('#month')) {
    if (num % 2 === 0) {
      max = 30;
    } else if (num === 1) {
      max = 29;
    } else {
      max = 31;
    }
    return $('#day').attr('max', max).val('1');
  }

  if ($(this).is('#day')) {
    if (num < 1) {
      num = 1;
    } else if (num > max) {
      num = max;
    } else {
      num = num;
    }
    return $('#day').val(num);
  }
  return false;
}

function zSign() {
  var month = Number($('#month').val());
  var day = Number($('#day').val());
  var sign;

  switch (month) {
    case 0:
      sign = day < 21 ? "Capricorn" : "Aquarius";
      break;
    case 1:
      sign = day < 19 ? "Aquarius" : "Pisces";
      break;
    case 2:
      sign = day < 21 ? "Pisces" : "Aries";
      break;
    case 3:
      sign = day < 21 ? "Aries" : "Taurus";
      break;
    case 4:
      sign = day < 21 ? "Taurus" : "Gemini";
      break;
    case 5:
      sign = day < 22 ? "Gemini" : "Cancer";
      break;
    case 6:
      sign = day < 23 ? "Cancer" : "Leo";
      break;
    case 7:
      sign = day < 24 ? "Leo" : "Virgo";
      break;
    case 8:
      sign = day < 23 ? "Virgo" : "Libra";
      break;
    case 9:
      sign = day < 24 ? "Libra" : "Scorpio";
      break;
    case 10:
      sign = day < 23 ? "Scorpio" : "Sagittarius";
      break;
    case 11:
      sign = day < 23 ? "Sagittarius" : "Capricorn";
      break;
    default:
      sign = null;
      break;
  }
  return $('#output').val(sign);
}  
 :root {
  font: 500 16px/1.3 Verdana
}

select,
input,
output,
button,
label {
  display: inline-block;
  font: inherit;
  margin: 5px 1px;
}

#day {
  width: 4ch;
  text-align: center;
}

#output::before {
  content: "a0";
}  
 <form id="zodiac">
  <label for="month">Month:</label>
  <select id="month">
    <option value='0' selected>January</option>
    <option value='1'>February</option>
    <option value='2'>March</option>
    <option value='3'>April</option>
    <option value='4'>May</option>
    <option value='5'>June</option>
    <option value='6'>July</option>
    <option value='7'>August</option>
    <option value='8'>September</option>
    <option value='9'>October</option>
    <option value='10'>November</option>
    <option value='11'>December</option>
  </select>
  <label for="day"> Day: </label>
  <input id="day" type='number' min='1' max='30' value='1'>
  <button type='button'>Done</button><br>
  <label for="output">Your sign is </label><output id='output'></output>
</form>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>