selectタグに応答したかどうかの確認

Question

クラスに「必須」のすべての入力をチェックする作業スクリプトがあり、入力内容にコンテンツが含まれているかどうかが検出され、答えがGoogles Invisible Recaptchaに渡されます。

私は選択したドロップダウンで問題に遭遇しています。

次JSは、テキストで動作例です。

var questions = document.getElementsByClassName('required'); 
var valid = true; 

for (var i=0; valid && i<questions.length; i++) { 
    if (!questions[i].value.trim()) { 
     valid = false; 
    } 
} 

私のドロップダウンの1のサンプルは以下のとおりです。誰でもに機能を追加する方法を知っている場合、私は思っていた

<select id="q6" class="required" name="designation"> 
     <!-- Disabled --> 
     <option disabled selected>Select one of the following:</option> 
     <!-- Options --> 
     <option value="#">Regisitered Nurse</option> 
     <option value="#">Regisitered Practical Nurse</option> 
     <option value="#">Personal Support Worker (Developmental Service Worker)</option> 
     <option value="#">Nursing Student (Completed First Year)</option> 
     <!-- Options // END --> 
</select> 

上記の私のスクリプトへの信頼できない選択ドロップダウンを検出する。 「ファイル」入力でこの作業を行うことができればそれは優れているでしょう。値を=「」あなたの最初の選択オプションに、それは空で、検証チェックに失敗しますデフォルトでよう：追加

乾杯、マット・

Answer 1

してみてください。

let validate = function() { 
 
    var questions = document.getElementsByClassName('required'); 
 
    var valid = true; 
 

 
    for (var i = 0; valid && i < questions.length; i++) { 
 
    if (!questions[i].value.trim()) { 
 
     valid = false; 
 
    } 
 
    } 
 

 
    console.log(valid); 
 

 
}

<input id="q5" class="required" name="name" type="text" /> 
 
<select id="q6" class="required" name="designation"> 
 
     <!-- Disabled --> 
 
     <option disabled selected value="">Select one of the following:</option> 
 
     <!-- Options --> 
 
     <option value="#">Regisitered Nurse</option> 
 
     <option value="#">Regisitered Practical Nurse</option> 
 
     <option value="#">Personal Support Worker (Developmental Service Worker)  </option> 
 
     <option value="#">Nursing Student (Completed First Year)</option> 
 
     <!-- Options // END --> 
 
</select> 
 
<button onclick="validate();">Validate</button>

Answer 2

あなたはselect要素ののselectedIndex属性を使用して検証して、もしあれば選択されたオプションからvalue属性を取得しようとすることができます

validate = function(){ 
 

 
    // Validate Select Elements 
 
    var selectElements = document.getElementsByTagName("select"); 
 
    for(var i = 0; i < selectElements.length; i++) 
 
    { 
 
    var selectedIndex = selectElements[i].selectedIndex; 
 
    if (selectedIndex < 0 || !selectElements[i][selectedIndex].getAttribute("value")) 
 
    { 
 
    \t return false;  
 
    } 
 
    } 
 
    
 
    // Validate other elements here... 
 
    
 
    return true; 
 
} 
 

 
//Clear the selection of the first select element to show how validations work for empty selection 
 
document.getElementById('select1').selectedIndex = -1;

<select id="select1"> 
 
     <option value="1">Option 1</option> 
 
     <option value="2">Option 2</option> 
 
     <option value="">Option With Empty Value Attribute</option> 
 
     <option>Option With No Value Attribute</option> 
 
</select> 
 
<br> 
 

 
<select id="select2"> 
 
     <option value="1">Option 1</option> 
 
     <option value="2">Option 2</option> 
 
     <option value="">Option With Empty Value Attribute</option> 
 
     <option>Option With No Value Attribute</option> 
 
</select> 
 
<br><br> 
 

 
<button onclick="alert(validate());">Validate</button>