Как включить DateTime, если флажок установлен? - PullRequest
0 голосов
/ 04 сентября 2018

Я искал справку в той части, где пользователь устанавливает флажок, и он включает определенное поле, например 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";
  }
}
Checkbox: <input type="checkbox" id="myCheck" onclick="myFunction()">

<p id="text" style="display:none">Checkbox is CHECKED!</p>

Спасибо заранее.

1 Ответ

0 голосов
/ 04 сентября 2018

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

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 также

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...