时间戳

首页 > 解决方案 > 如何获取两个不同选择元素的值并在函数中使用它们

javascript - 如何获取两个不同选择元素的值并在函数中使用它们

问题描述

我有两个不同的选择元素。一个是用户选择他们的性别，另一个是用户选择他们居住的地方。

我有;

<select class="selectGender" name="gender" id="styleSelect" required>
  <option value="">None</option>
  <option value="male">Male</option>
  <option value="female">Female</option>
</select>

和

<select class="selectPlace" name="place" id="styleSelect" onchange="return checkGender()" required>
  <option name="dorm" value="">None</option>
  <option name="dorm" value="town" name="">Town</option>
  <option name="g" value="city">City</option>
</select>

我想要的是，当用户选择男性作为性别并从其他选择元素中选择城镇时，他应该得到“不允许”的警报。

这是我到目前为止所做的，但我没有从中得到任何东西。

function checkGender() {
  let gender = document.getElementsByName('gender');
  let place = document.getElementsByName('place');
  if (gender.value == "male" && place.value == "town") {
    alert("Not allowed");
  }
}

标签： javascripthtmluser-interfaceuser-inputhtml-select

解决方案

您的 html 代码有错误，请检查此

enter code here  

<select class="selectGender" name="gender"  id="styleSelect" required >
  <option value="">None</option>
    <option value="male">Male</option>
      <option value="female">Female</option>
     
</select>
      
 enter code here 
 
 <select class="selectPlace" name="place" id="styleSelect1" onchange="checkGender()" required>
    <option name="dorm" value="">None</option>
    <option name="dorm" value="town">Town</option>
    <option name="g" value="city">City</option>
    
</select>
    
    <script>
    function checkGender(){
      let gender=document.getElementsByName('gender')[0].value;
      let place=document.getElementsByName('place')[0].value;
      console.log(gender);
      console.log(place);
      if (gender=="male"&&place=="town") {
        alert("Not allowed");
      }
    }
    </script>

推荐阅读