JavaScript : How to properly check if selected option is empty?

Question

我在这里选择了选项，我不知道为什么如果我没有选择任何选项，这意味着 (-select-)values=""没有值，仍然不起作用。我的选择选项是一个数组，因为它在循环中。

这是我的代码

var randomGender_arr = [];
var tae = true;
if(randGender == 'random'){
    $('select[name="randomGender[]"]').each(function(k,v){

        if($(v).val()===''){
            alert('Please select a gender')
        }else{
            randomGender_arr.push($(v).val());
        }

    });
}else{

}

顺便说一句，我选择的选项在这里，您可以看到我的第一个选项已禁用。怎么能算空呢？并检查当我留下 1 个选项 (-select-) 时是否返回 false。

echo'<div style="float:right; position:absolute; top:10px; right:0;">
<label for="randomGender">Gender:</label>
    <select name="randomGender[]" id="randomGender" class="form-control randomGender">
        <option disabled readonly selected>-select-</option>
        <option value="male">Male</option>
        <option value="female">Female</option>
    </select>
</div>
<div style="clear:both;"></div>';

Answer 1

let changeTime = 0;

let opt = document.querySelector(".opt");

let submit = document.querySelector(".submit");

let notif = document.querySelector(".notif");

opt.addEventListener("change",function(){
  changeTime++;
});

submit.addEventListener("click",function(){

  if(changeTime != 0){
    // Success
    notif.textContent = "Success";
    
  }else{
    notif.textContent = "Please chose at less one time!";
  }
  
});

<div class="opt" style="float:right; position:absolute; top:10px; right:0;">
<label for="randomGender">Gender:</label>
    <select name="randomGender[]" id="randomGender" class="form-control randomGender">
        <option disabled readonly selected>-select-</option>
        <option value="male">Male</option>
        <option value="female">Female</option>
    </select>
</div>
<div style="clear:both;"></div>
<button class="submit">Button</button>
<p class="notif"></p>