Как включить DateTime, если флажок установлен?

Я пытаюсь реализовать это, когда пользователь устанавливает флажок, он включает определенное поле, например DateTime в JavaScript.

Например, по умолчанию dateTime отключен, пока пользователь не установит флажок, затем DateTime будет включен.

Это похоже на то, что я искал, который используется для отображения текста, когда пользователь устанавливает флажок:

function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("myCheck");
  // Get the output text
  var text = document.getElementById("text");

  // If the checkbox is checked, display the output text
  if (checkBox.checked == true){
    text.style.display = "block";
  } else {
    text.style.display = "none";
  }
}

Флажок:

<input type = "checkbox" id = "myCheck" onclick = "myFunction()">
    
<p id = "text" style = "display:none">Checkbox is CHECKED!</p>

Пожалуйста, опубликуйте минимальный воспроизводимый пример вашей попытки и конкретно укажите, где вы застряли.

Luca Kiebel 04.09.2018 22:36

вы можете показать свой HTML?

Dacre Denny 04.09.2018 22:36

так установить отключенное свойство?

epascarello 04.09.2018 23:05
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
3
531
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете добиться этого, выполнив следующие действия. Я добавил в код документацию, чтобы объяснить, как работает это решение:

var yourCheckbox = document.querySelector('#myCheck');
var yourDateField = document.querySelector('#yourDateField');

// This function will update the date field's enabled/disabled
// attribute, depending on if the yourCheckbox is checked
function updateYourDateField() {
    
    if (yourCheckbox.checked) {
       yourDateField.disabled = true;
    }
    else {
       yourDateField.disabled = false;
    }
}
   
// Add an event listener to the change event, that causes
// the date field to be enabled/disabled when ever the checkbox
// is clicked and the value changes
yourCheckbox.addEventListener('change', function() {
       
   updateYourDateField();
})
 
// Call this to ensure your date field is in correct state
// when the script is first run
updateYourDateField();
<form>
  <div>
    <label>Disable/Enable control</label>
    <input id = "myCheck" type = "checkbox" />
  </div>
  <div>
    <label>The date field</label>
    <input id = "yourDateField" type = "date" />
  </div>
</form>

Вот рабочий jsFiddle также

Что ж, это быстрый ответ, которому очень просто следовать. Спасибо.

Cha-Lee Chew 04.09.2018 23:26

Я хотел бы знать, можно ли сохранить введенную вами дату в базе данных. Спасибо

Cha-Lee Chew 05.09.2018 00:04

@ Cha-LeeChew: да, это можно добавить в базу данных, но это потребует более подробной информации. Может быть, вы могли бы задать для этого еще один вопрос?

Dacre Denny 05.09.2018 00:08

Я добавил свой новый вопрос по этой проблеме. Спасибо за руководство.

Cha-Lee Chew 05.09.2018 00:32

Я новичок в этом, можете ли вы мне принять это как ответ? : D

Cha-Lee Chew 05.09.2018 00:36

@ Cha-LeeChew никаких проблем - вы просто ставите галочку рядом с ответом. Должно получиться так: meta.stackoverflow.com/questions/251078/…

Dacre Denny 05.09.2018 00:38

Другие вопросы по теме