自动选择从下拉菜单中如果只有两个选择

Question

我得到了2名选择的下拉列表中，有时只有2个选项每个

“请选择”和“真实的选项”。

在这种情况下，我希望它自动选择“True Option”。 “True Option”的值不总是相同的，但“Please Select”值总是空的，所以我需要选择一个非空值的值。

if ($('.product-options .inputbox').size() == 2) { 
 
    $('.product-options .inputbox').not(.val('')).attr('selected', true); 
 
}

<div class="product-options"> 
 
    <div id="option-98" class="options_class"> 
 
    <div> 
 
     <strong>Size:</strong> 
 
     <select id="options98" class="inputbox" name="options[98]" onchange="updatePrice();"> 
 
     <option value="" selected="selected">--- Please Select ---</option> 
 
     <option value="99">Small</option> 
 
     </select> 
 
    </div> 
 
    </div> 
 
    <div id="option-99" class="options_class"> 
 
    <div> 
 
     <strong>Color:</strong> 
 
     <select id="options99" class="inputbox" name="options[99]" onchange="updatePrice();"> 
 
     <option value="" selected="selected">--- Please Select ---</option> 
 
     <option value="100">Black</option> 
 
     </select> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

可以使用.each功能遍历选择。

$(function(){ 
 
    $("select").each(function(i, e){ 
 
    var $e = $(e); 
 
    
 
    if($e.children().length == 2){ 
 
     $e.find("option[value='']").attr("selected", false); 
 
     $e.find("option[value!='']").attr("selected", true); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="product-options"> 
 
<div id="option-98" class="options_class"> 
 
    <div> 
 
     <strong>Size:</strong> 
 
     <select id="options98" class="inputbox" name="options[98]" onchange="updatePrice();"> 
 
      <option value="" selected="selected">--- Please Select ---</option> 
 
      <option value="99">Small</option> 
 
     </select> 
 
    </div> 
 
</div> 
 
<div id="option-99" class="options_class"> 
 
    <div> 
 
     <strong>Color:</strong> 
 
     <select id="options99" class="inputbox" name="options[99]" onchange="updatePrice();"> 
 
      <option value="" selected="selected">--- Please Select ---</option> 
 
      <option value="100">Black</option> 
 
     </select> 
 
    </div> 
 
</div> 
 
<div id="option-100" class="options_class"> 
 
    <div> 
 
     <strong>Select with 3 values:</strong> 
 
     <select id="options100" class="inputbox" name="options[100]" onchange="updatePrice();"> 
 
      <option value="" selected="selected">--- Please Select ---</option> 
 
      <option value="100">One</option> 
 
      <option value="101">Two</option> 
 
     </select> 
 
    </div> 
 
</div> 
 
</div>