текстовое поле не скрывается с помощью флажка (javascript) - PullRequest
Новая
       6

текстовое поле не скрывается с помощью флажка (javascript)

1 голос
/ 30 января 2020

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

Javascript: 

function TMDFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("tmd_checkbox");
  // Get the output text
  var text = document.getElementById("test");

  // 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" class="product" name="targetedmobiledisplay" value="0.08" id="tmd_checkbox" onclick="TMDFunction()">
Targeted Mobile Display
<br> 
Test: <input id="test" type="text" value="0.00" data-total="0" />

Ответы [ 2 ]

1 голос
/ 30 января 2020

да, просто, добавьте стиль, который вы хотите по умолчанию, например, вы хотите, чтобы он был display: none, поэтому он вставляется в HTML. 

function TMDFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("tmd_checkbox");
  // Get the output text
  var text = document.getElementById("test");

  // 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" class="product" name="targetedmobiledisplay" value="0.08" id="tmd_checkbox" onclick="TMDFunction()"> Targeted Mobile Display
<br> 
Test: 
<input id="test" type="text" value="0.00" data-total="0" style="display:none;" />
0 голосов
/ 30 января 2020

TMDFunction() запускается только при установленном флажке. Первоначально, когда страница загружается, функция не вызывается.

Вы можете попытаться скрыть текстовое поле, когда страница загружается с помощью document.ready. 

$( document ).ready(function() {
   var text = document.getElementById("test");
  test.style.display = 'none';
});

Эта функция скрывает текстовое поле после загрузки страницы.

...