复选框下拉内容部分不适用于所有复选框

时间:2021-07-02 07:58:46

标签: checkbox toggle

希望你一切顺利!我已经创建了 4 个带有详细信息的复选框切换,但同时只有一个复选框切换在我单击另一个复选框时起作用 3 个切换不起作用,为不同的复选框创建了 4 个脚本并更改每个复选框的 ID 但不工作,放置了 html 和 javascript 代码,请帮忙解决问题...

new Vue({
    el: '#app',
  data: function() {
    return {
      get loggedIn() {
        return localStorage.getItem('userId');
      },
      set loggedIn(value) {
        localStorage.setItem('userId', value);
      }
    };
  },
  methods:{
    setLogin(){
     if(localStorage.getItem('userId') !== 'null')
      this.userId = null;
    else
     this.userId = Math.random();
   }
  }
});
<script>
function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("chkNIRF");
  // Get the output text
  var Check-content = 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";
  }
}
</script>
<script>
function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("chkNAAC");
  // Get the output text
  var Check-content = 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";
  }
}
</script>
<script>
function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("chkINI");
  // Get the output text
  var Check-content = 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";
  }
}
</script>
<script>
function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("chkIoE");
  // Get the output text
  var Check-content = 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";
  }
}
</script>

0 个答案:

没有答案
相关问题