Html 为什么我的复选框变为文本_Html_If Statement_Checkbox

Html 为什么我的复选框变为文本

html if-statement checkbox

Html 为什么我的复选框变为文本,html,if-statement,checkbox,Html,If Statement,Checkbox,为什么我的复选框变为文本如何使我们勾选结果更改的复选框？有人能修改我的代码吗？此外，我希望我的复选框更整洁。我不希望它彼此如此接近函数fungsi{ var a=document.getElementByIdsubAnimal1.checked； var b=document.getElementByIdsubAnimal2.checked； var c=document.getElementByIdsubAnimal3.checked； var d=document.getElement

为什么我的复选框变为文本

如何使我们勾选结果更改的复选框？有人能修改我的代码吗？此外，我希望我的复选框更整洁。我不希望它彼此如此接近

函数fungsi{ var a=document.getElementByIdsubAnimal1.checked； var b=document.getElementByIdsubAnimal2.checked； var c=document.getElementByIdsubAnimal3.checked； var d=document.getElementByIdsubAnimal4.checked； var e=document.getElementByIdsubAnimal5.checked；如果a&&b&&c&&d&&e{ document.getElementByIdsubAnimal.innerHTML=kiv1； }否则，如果a&b{ document.getElementByIdsubAnimal.innerHTML=kiv2； }否则，如果b&a&c{ document.getElementByIdsubAnimal.innerHTML=kiv13； }否则如果{ document.getElementByIdsubAnimal.innerHTML=kiv4； }否则{ 警报正在进行中！； } } 函数ShowHideDivAnimal{ var subAnimal=document.getElementByIdsubAnimal； subAnimal.style.display=Animal.checked？块：无； console.logAnimal.value console.logText内标签：+Animal.parentNode.textContent } 动物 123 456 789 101112 基辅

页面中有重复的id subAnimal

<div id="subAnimal" style="display: none">
...
<p id="subAnimal"></p>

以下是修改后的版本：

<head>
<script>
function fungsi() {

  var a = document.getElementById("subAnimal1").checked;
  var b = document.getElementById("subAnimal2").checked;
  var c = document.getElementById("subAnimal3").checked;
  var d = document.getElementById("subAnimal4").checked;
  var e = document.getElementById("subAnimal5").checked;

  if (a && b && c && d && e) {
    document.getElementById("subAnimalx").innerHTML = "kiv1";
  } else if (a && b) {
    document.getElementById("subAnimalx").innerHTML = "kiv2";
  } else if (b && a && c) {
    document.getElementById("subAnimalx").innerHTML = "kiv13";
  } else if (a) {
    document.getElementById("subAnimalx").innerHTML = "kiv4";
  } else {
    alert("In progress!");
  }
}
</script>
</head>

<body>

<script type="text/javascript">
  function ShowHideDiv(Animal) {
    var subAnimal = document.getElementById("subAnimal");
    subAnimal.style.display = Animal.checked ? "block" : "none";
    console.log(Animal.value)
    console.log("Text Inside LABEL:" + Animal.parentNode.textContent)
  }
</script>

<label for="Animal">
<input type="checkbox" id="Animal" onClick="ShowHideDiv(this)" value="Animal"/> Animal 
</label>

<form>
<div id="subAnimal" style="display: none">

<label> 
<input type="checkbox" id="subAnimal1" onclick="fungsi()"/>123
</label>


<label>
  <input type="checkbox" id="subAnimal2" onclick="fungsi()"/>456 
</label>


<label>
  <input type="checkbox" id="subAnimal3" onclick="fungsi()"/>789 
</label>

<label>
<input type="checkbox" id="subAnimal4" onclick="fungsi()"/>101112 
</label>

<label>
  <input type="checkbox" id="subAnimal5" onclick="fungsi()"/>KIV 
</label>
</form>

<p id="subAnimalx"></p>

在这两种情况下，id都是重复的，所以请尝试下面的代码

函数fungsi{ var a=document.getElementByIdsubAnimal1.checked； var b=document.getElementByIdsubAnimal2.checked； var c=document.getElementByIdsubAnimal3.checked； var d=document.getElementByIdsubAnimal4.checked； var e=document.getElementByIdsubAnimal5.checked；如果a&&b&&c&&d&&e{ document.getElementByIdsubAnimalLabel.innerHTML=kiv1； }否则，如果a&b{ document.getElementByIdsubAnimalLabel.innerHTML=kiv2； }否则，如果b&a&c{ document.getElementByIdsubAnimalLabel.innerHTML=kiv13； }否则如果{ document.getElementByIdsubAnimalLabel.innerHTML=kiv4； }否则{ 警报正在进行中！； } } 函数ShowHideDivAnimal{ var subAnimal=document.getElementByIdsubAnimal； subAnimal.style.display=Animal.checked？块：无； console.logAnimal.value console.logText内标签：+Animal.parentNode.textContent } 动物 123 456 789 101112 基辅