Javascript 对多个HTML复选框执行条件_Javascript_Html_Conditional Statements_Multipleselection

Javascript 对多个HTML复选框执行条件

javascript html

Javascript 对多个HTML复选框执行条件,javascript,html,conditional-statements,multipleselection,Javascript,Html,Conditional Statements,Multipleselection,所以我以前也写过一篇关于同一个问题的文章，但我删除了那篇文章，进一步简化了我的代码，纠正了一些错误。因此，我的目标是根据所选择的属性和技能为球员提供建议函数随机（）{ var a=document.getElementById（“位置”）.value； document.getElementById（“输出”）.innerHTML=a；如果（a）{ console.log（“伟大的选择”）； } } var val=0，表单=document.forms.skills， text=ski

所以我以前也写过一篇关于同一个问题的文章，但我删除了那篇文章，进一步简化了我的代码，纠正了一些错误。因此，我的目标是根据所选择的属性和技能为球员提供建议

函数随机（）{
var a=document.getElementById（“位置”）.value；
document.getElementById（“输出”）.innerHTML=a；
如果（a）{
console.log（“伟大的选择”）；
}
}
var val=0，
表单=document.forms.skills，
text=skills.elements.type；
表格.附录列表（“变更”，功能（e）{
var checkbox=form.querySelectorAll（“[type='checkbox']”）；
text.value=“”；
数组.from（复选框）.forEach（函数（复选框）{
如果（复选框。选中）{
text.value+=checkbox.value+“\n”；
}
});
});

NBA选秀预测




选择所需的职位
选择位置
得分后卫
三维防护
传球后卫
得分前锋
三维前进
得分中心
防守中锋
轮辋保护器



您已选择以下职位：


选择所需的技能
高度
重量
臂长
手指长度

您选择了：

NBA选秀球员建议
NBA选秀预测








选择所需的职位
选择位置
得分后卫
三维防护
传球后卫
得分前锋
三维前进
得分中心
防守中锋
轮辋保护器



您已选择以下职位：


选择所需的技能
高度
重量
臂长
手指长度

您选择了：
得到结果
var val=0，
表单=document.forms.skills，
text=skills.elements.type；
表格.附录列表（“变更”，功能（e）{
var checkbox=form.querySelectorAll（“[type='checkbox']”）；
text.value=“”；
数组.from（复选框）.forEach（函数（复选框）{
如果（复选框。选中）{
text.value+=checkbox.value+“\n”；
}
});
});
函数随机（）{
var a=document.getElementById（“位置”）.value；
document.getElementById（“输出”）.innerHTML=a；
if（a=='Scoring Guard'&&document.getElementById（“ch1”）.checked==true&&document.getElementById（“ch2”）.checked==true）{
警惕（“玩家1”）；
}
}

NBA选秀球员建议
NBA选秀预测








选择所需的职位
选择位置
得分后卫
三维防护
传球后卫
得分前锋
三维前进
得分中心
防守中锋
轮辋保护器



您已选择以下职位：


选择所需的技能
高度
重量
臂长
手指长度

您选择了：
得到结果
var val=0，
表单=document.forms.skills，
text=skills.elements.type；
表格.附录列表（“变更”，功能（e）{
var checkbox=form.querySelectorAll（“[type='checkbox']”）；
text.value=“”；
数组.from（复选框）.forEach（函数（复选框）{
如果（复选框。选中）{
text.value+=checkbox.value+“\n”；
}
});
});
函数随机（）{
var a=document.getElementById（“位置”）.value；
document.getElementById（“输出”）.innerHTML=a；
if（a=='Scoring Guard'&&document.getElementById（“ch1”）.checked==true&&document.getElementById（“ch2”）.checked==true）{
警惕（“玩家1”）；
}
}
不清楚输入如何对应输出“Player1”？您是否有一个数组或类似的玩家，您希望与输入的标准/位置匹配？@BrettGregson是的，我们计划最初有一个具有各种属性的玩家数组。没有这部分，我不确定问题是什么？但是如何在html中对多个选择执行条件。也许会说，如果我选择“身高”和“体重”，至少我需要一个“伟大选择”的输出。不清楚输入与输出“Player1”如何对应？您是否有一个数组或类似的玩家，您希望与输入的标准/位置匹配？@BrettGregson是的，我们计划最初有一个具有各种属性的玩家数组。没有这部分，我不确定问题是什么？但是如何在html中对多个选择执行条件。比如说，如果我选择“身高”和“体重”，至少我需要一个“很棒的选择”的输出。你应该在每个复选框中添加一个Id，然后检查已选中的内容并显示你所需的值。我希望在你的情况下，你没有太多的条件，因为你可以写很多条件。最好的选择是使用机器学习进行预测。您可以根据自己的要求建立自己的模型。谢谢。我会试试看是否可能。是的，需要很多条件。您应该在每个复选框中添加一个Id，然后检查已选中的内容并显示所需的值。我希望在你的情况下，你没有太多的条件，因为你可以写很多条件。最好的选择是使用机器学习进行预测。您可以根据自己的要求建立自己的模型。谢谢。我会试试看是否可能。是的，需要很多条件
<html>

<head>
  <title>NBA Draft Player Suggestion</title>

</head>
<!--<style>
body {
  background-image: url('Img3.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;  
  background-size: cover;
}
</style>
-->

<body style="background-color:powderblue;">




  <h1>NBA Draft Prediction</h1>
  <br>
  <a href="default.asp">
    <img src="https://basketball91.com/files/2013/06/basketball-positions.gif" alt="Daruis Garland" style="float:centre;width:300px;height:300px;" align="middle">
  </a>
  <br>
  <br>





  <br>
  <h2> Choose the required position </h2>
  <select id="Position" onchange="random()">
    <option>Choose Position</option>
    <option value="Scoring Guard">Scoring Guard</option>
    <option value=" 3 & D Guard">3 & D Guard</option>
    <option value="Passing Guard">Passing Guard</option>
    <option value="Forward">Scoring Forward</option>
    <option value="3&D Forward">3 & D Forward</option>
    <option value="Scoring Center">Scoring Center</option>
    <option value="Defending Center">Defending Center</option>
    <option value="Ring Protector">Rim Protector</option>
  </select>

  <br>
  <br> You have Chosen the position of:
  <div id="output"></div>

  <br>
  <h2> Choose the required Skills</h2>

  <form name="skills" method="post">
    <label><input type="checkbox" name="j1" value="Height" class="anyclass"id="ch1"/> Height</label>
    <label><input type="checkbox" name="j2" value="Weight" class="anyclass" id="ch2"/> Weight</label>
    <label><input type="checkbox" name="j3" value="ArmLength" class="anyclass"  id="ch3"/> Arm Length</label>
    <label><input type="checkbox" name="j4" value="FingerLength" class="anyclass" id="ch4"/> Finger Length </label><br>
    <h3>You have chosen:
      <textarea name="type" rows="5" cols="10"></textarea>

      <button name="btn" onclick="random()">Get Result</button>




      <!--<br>
<a href="NBA_2nd_Page.html" class="btn btn-info" role="button">Click Here To Go To Next Page</a>
-->
<script>
var val = 0,
    form = document.forms.skills,
    text = skills.elements.type;
form.addEventListener("change", function(e) {
  var checkboxes = form.querySelectorAll("[type='checkbox']");
  text.value = "";
  Array.from(checkboxes).forEach(function(checkbox) {

    if (checkbox.checked) {
      text.value += checkbox.value + "\n";
    }
  });
});
function random() {
  var a = document.getElementById("Position").value;
  document.getElementById("output").innerHTML = a;

  if(a == 'Scoring Guard'  && document.getElementById("ch1").checked == true && document.getElementById("ch2").checked == true){
    alert('Player1'); 
  }

}

</script>


</body>

</html>