文本框不会与复选框单击一起隐藏（javascript）

Question

我有一个文本框，如果未选中该复选框，我想在该复选框上单击并消失，但是，我的代码当前在页面加载时显示该文本框，但是一旦选择然后取消选择该复选框，它就会像预期的那样消失至。有什么想法吗？

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" />

Answer 1

TMDFunction()仅在单击复选框时运行。最初，在页面加载时，不会调用该函数。

Answer 2

是的，很容易，添加您想要的默认样式，例如，您想成为display: none，因此将其插入HTML。